JavaScript中的伪数组/数组与伪数组的转换/伪数组的用处

伪数组是什么

伪数组是类似数组的、具有length属性的、按照索引存储数据的对象。
JavaScript中常见的伪数组有：普通函数的arguments对象、DOM的各个节点集合。

数组和伪数组的区别

举个例子：

可以看到二者的prototype不同。

• 伪数组并不是数组，它没有继承 Array.proptotype，只是看着像数组。
• 伪数组不能调用数组的push，concat，filter，find等方法。
• 伪数组不能使用 forEach来遍历。
• 可以通过Array.isArray()来判断是否为数组。

将伪数组转换为数组

使用Array原型的slice方法复制伪数组，并通过call改变this指向到arguments，这样arguments就可以使用数组的slice方法了。

// ------test----------
  function test(a,b){
    // [a,b]是arguments 伪数组
    const arr = Array.prototype.slice.call(arguments);
    console.log("arguments:",arguments);
    console.log("arr:",arr);
  }
  test(1,2);

伪数组的使用

• 遍历DOM元素。可以使用for循环遍历DOM。
• 访问函数参数arguments。arguments是伪数组，可以用于访问并实现可变参数函数。

这里写一个通过伪数组实现距离现在事件最近的12个月，并以xxxx年xx月、xxxx-xx形式返回日期，可以用于项目数据的整理。

//近一年的每个月的月份显示
export const monthArr = Array.from({length:12},(k,v)=>{
  //substract前推v个月
  const monthDate = moment().subtract(v,'month');
  return{
    value:monthDate.format('YYYY-MM'),
    label:monthDate.format('YYYY年MM月')
  }
})

{length:12}是一个伪数组对象。这里Array.from({length:12})就是一个长度为5，元素都是undefined的数组，然后第二个参数是给每个项目调用的函数，返回monthArr。打印出来是这样的：