如何格式化 javascript 包含大量值的数组

Question

在 javascript 中，我正在创建一个包含一些值的数组。值列表相对较长，导致单行代码在大多数屏幕上出现在两行中。比如这行代码是：

var fieldNames = ['firstName', 'lastName', 'phoneNumber', 'emailAddress', 'hotelName', 'roundTrip', 'origin', 'departureDate', 'departureTime', 'returnDate', 'returnTime'];

是否有一种首选方法来格式化此行以使其更具可读性？数组中的每个值都应该独占一行吗？

Answer 1

var fieldNames = ['firstName', 'lastName', 'phoneNumber', 'emailAddress', 
'hotelName', 'roundTrip', 'origin', 'departureDate', 'departureTime',
'returnDate', 'returnTime'];

Answer 2

这是我通常做的事情：

var fieldNames = [
        'firstName', 'lastName', 'phoneNumber', 'emailAddress', 'hotelName', 
        'roundTrip', 'origin', 'departureDate', 'departureTime', 'returnDate',
        'returnTime'
    ];

这就是我所做的。这可能是个好主意，也可能不是。

至少对我来说，它帮助我理解数组的开始和结束位置以及它属于什么变量。

Answer 3

如果目标是提高代码的可读性，那么将每个元素单独放在一行中效果很好。

例如，按原样，如果您对数组中的元素进行更改并提交到 git，整行将在 diff 中显示为已更改。其他人很难准确地看到哪个元素发生了变化。

如果每个元素都在其自己的行上，并且您对一个元素进行了更改然后提交到 git，那么只有包含已更改元素的行才会显示在 diff 中。然后很明显哪个元素被更改了。

Answer 4

我们在项目中使用require.js，有时会发生一个模块需要很多依赖项，所以我们的代码如下所示：

require([
    module1,
    module2,
    module3,
    module4,
    module5,
    module6
], function(
    module1_obj,
    module2_obj,
    module3_obj,
    module4_obj,
    module5_obj,
    module6_obj
){
...
});

因为我们必须定义 2 个非常长的列表，所以我们将其格式化为一列，一行 1 项，这样当我们删除一个依赖项时，我们可以轻松地在两列中删除它并看到两者具有相同的项目数。

澄清： require.js 中的第一个数组定义了依赖项，第二个数组给出了使用该依赖项的对象，这就是为什么有两个数组的原因。

不将任何项目放在第一行的好处

var foo = [ // <-- Not having an element on this line.
    1,
    2,
    3
];

那么数组的定义方式与对象的定义方式通常是：

var bar = {
    iAmAProperty: "YAY"
};

并且在版本控制中可以清楚地看到object/array的内容是否被编辑或者object/array

的名称

如何格式化 javascript 包含大量值的数组

How to format javascript array with lots of values

javascript

arrays

code-formatting