数组中的空位
JavaScript中数组有空位的概念,也就是一个数组的位置上没有任何的值,生成的方式有四种:
(1)直接定义
let arr = [1, , 3]; // [1, empty, 3]
(2)删除属性
let arr = [1];
delete arr[0]; // [empty,];
(3)使用new Array
方法
new Array(2); // [empty, empty];
可以使用ES6的
Array.of
代替new Array
,当参数个数不同时,它的行为更一致
(4)定义数组长度
let arr = [];
arr.length = 2; // [empty, empty]
辨别空位和undefined
空位并不等于undefined
和null
,如果数组的一个位置上是undefined
或者null
,那么它依然有值。但是我们如果直接用数组下标读取数组的空位,得到的结果却是undefined
:
const arr = new Array(2);
arr[0]; // undefined
如何区别数组成员是空位还是undefined
呢?可以使用hasOwnProperty
方法或者in
运算符,二者对于undefined
和null
都返回true
,但是对于空位,由于根本没有值,所以会返回false
:
const arr = [undefined, ,]; // [undefined, empty];
console.log(0 in arr); // true
console.log(1 in arr); // false
console.log(arr.hasOwnProperty(0)); // true
console.log(arr.hasOwnProperty(1)); // false
数组方法对空位的处理
数组中的各种原生方法对空位的处理并不相同,有下面集中处理方式:
(1)作为undefined
处理
Array.from
、结构运算符...
、for...of
、fill
方法都会将空位作为undefined
处理
const arr = new Array(4);
Array.from(arr);
// [undefined, undefined, undefined, undefined]
[...arr];
// [undefined, undefined, undefined, undefined]
for (const i of arr) {
console.log(i);
}
// undefined, undefined, undefined, undefined
arr.fill(1);
// [1, 1, 1, 1]
(2)跳过
every
/filter
/forEach
/some
/find
/indexOf
/都会跳过空位
(3)其他
map
方法会跳过空位,但是在结果中保留这个值Object.keys()
方法不会取到空位的下标join
方法会当做空字符串对待,返回',,,'
sort
方法会将empty的元素排到最后
练习
不用for
方法,创建一个长度为100的数组,每个元素的值等于它的下标:
Array.from({length: 100}, (v, index) => index);
Array.from(Array(100), (v, index) => index);
[...Array(100)].map((v, index) => index);
Array(100).fill(undefined).map((v, index) => index)'
Array.from(Array(100).keys());
[...Array(100).keys()];
Object.keys(Array(100).join().split(',')).map(v => +v)