数组的空位

数组的空位指，数组的某一个位置没有任何值。比如，Array构造函数返回的数组都是空位。

  1. Array(3) // [, , ,]

上面代码中，Array(3)返回一个具有 3 个空位的数组。

注意，空位不是undefined，一个位置的值等于undefined，依然是有值的。空位是没有任何值，in运算符可以说明这一点。

  1. 0 in [undefined, undefined, undefined] // true
  2. 0 in [, , ,] // false

上面代码说明，第一个数组的 0 号位置是有值的，第二个数组的 0 号位置没有值。

ES5 对空位的处理，已经很不一致了，大多数情况下会忽略空位。

  • forEach(), filter(), reduce(), every() 和some()都会跳过空位。
  • map()会跳过空位，但会保留这个值
  • join()和toString()会将空位视为undefined，而undefined和null会被处理成空字符串。
  1. // forEach方法
  2. [,'a'].forEach((x,i) => console.log(i)); // 1
  4. // filter方法
  5. ['a',,'b'].filter(x => true) // ['a','b']
  7. // every方法
  8. [,'a'].every(x => x==='a') // true
  10. // reduce方法
  11. [1,,2].reduce((x,y) => x+y) // 3
  13. // some方法
  14. [,'a'].some(x => x !== 'a') // false
  16. // map方法
  17. [,'a'].map(x => 1) // [,1]
  19. // join方法
  20. [,'a',undefined,null].join('#') // "#a##"
  22. // toString方法
  23. [,'a',undefined,null].toString() // ",a,,"

ES6 则是明确将空位转为undefined。

Array.from方法会将数组的空位，转为undefined，也就是说，这个方法不会忽略空位。

  1. Array.from(['a',,'b'])
  2. // [ "a", undefined, "b" ]

扩展运算符（...）也会将空位转为undefined。

  1. [...['a',,'b']]
  2. // [ "a", undefined, "b" ]

copyWithin()会连空位一起拷贝。

  1. [,'a','b',,].copyWithin(2,0) // [,"a",,"a"]

fill()会将空位视为正常的数组位置。

  1. new Array(3).fill('a') // ["a","a","a"]

for...of循环也会遍历空位。

  1. let arr = [, ,];
  2. for (let i of arr) {
  3.   console.log(1);
  4. }
  5. // 1
  6. // 1

上面代码中，数组arr有两个空位，for...of并没有忽略它们。如果改成map方法遍历，空位是会跳过的。

entries()、keys()、values()、find()和findIndex()会将空位处理成undefined。

  1. // entries()
  2. [...[,'a'].entries()] // [[0,undefined], [1,"a"]]
  4. // keys()
  5. [...[,'a'].keys()] // [0,1]
  7. // values()
  8. [...[,'a'].values()] // [undefined,"a"]
  10. // find()
  11. [,'a'].find(x => true) // undefined
  13. // findIndex()
  14. [,'a'].findIndex(x => true) // 0

由于空位的处理规则非常不统一，所以建议避免出现空位。