JS Array中的empty

2019年09月22日Web前端

起因是这样的,我需要循环n次,利用new Array配合forEach,结果发现一次循环都没触发。

问题

代码大致是这样的:

(new Array(10)).forEach(function(val, ind) {
    console.log(ind);
});

可以在浏览器下试下,发现循环根本就不会进入。那换for循环试下呢?

let arr = new Array(10);

for (let i = 0, len = arr.length; i < len; ++i) {
    console.log(arr[i]);        // undefined * 10
    console.log(i);
}
console.log(arr[0]);            // undefined

结果发现for循环没有问题,而每项值也是undefined。那new Array 出来的实例是什么呢?

new Array(10);      // [empty × 10]

let arr = [];
arr.length = 10;    // [empty × 10]

let arr2 = [1, 2, 3, 4];
delete arr2[1];
arr2;               // [1, empty, 3, 4]

所以在数组中,没有值的情况下,他就是用empty去表现的,而当我们使用的时候,他表现为undefined。

而先前for循环可以是因为我们取了数组的length,forEach是针对数组中存在值的做遍历的。

数组方法

接下来,我们来测下什么时候empty会生效,什么时候表现为undefined:

// 表现为undefined,不会被过滤掉:
arr[0] === undefined;                   // true
typeof arr[0];                          // "undefined"
arr.includes(undefined)                 // true
arr.includes()                          // true
arr.find                                // 
arr.join()                              // ",,,,,,,,,"
arr.sort()                              // empty被排到最后

// 表现为empty,会被过滤掉:
arr.indexOf(undefined);                 // -1
arr.some((item) => item === undefined)  // empty会被过滤掉
arr.every((item) => item === undefined) // empty会被过滤掉
arr.filter                              // empty会被过滤掉
arr.forEach                             // empty会被过滤掉,刚测试过
arr.map                                 // empty会被过滤掉,但返回的数组长度和arr一致
arr.reduce                              // Reduce of empty array with no initial value