类数组 / 伪数组

并非真正意义上的数组，虽然长得像数组也有length属性，它并不具有数组的方法

哪里有伪数组？

1.获取到的DOM元素的结合

let div = document.getElementsByTagName('div')
console.log(div);                   // HTMLCollection

let div2 = document.getElementsByClassName('div')
console.log(div2);                  // HTMLCollection

let div3 = document.querySelectorAll('div')
console.log(div3);                  // NodeList

2. 函数中的`arguments`

function foo(){
    console.log(arguments);
}
foo(1,'lee',true)

如何检测一个集合是不是数组？

看它是不是数组的示例

console.log(div3 instanceof(Array)); // false

看数组的方法它可以使用吗？

console.log(div3.push(1)); // caught TypeError: div3.push is not a function

如何把伪数组转成真正的数组

ES5中使用slice()方法把伪数组转成真正的数组

let arr = Array.prototype.slice.call(div3)
arr.push(123)
console.log(arr);     // [1,2,3]

Array.from

ES6中使用Array.from把伪数组转成真正的数组

let fakeArray = {
    0: '张三',
    1: '李四',
    2: '花满楼',
    length: 3
}
let arr = Array.from(fakeArray)
arr.push('push的数据')
console.log(arr);
console.log(arr[2]);

Array.of()

使用new Array()构造器构造数组的问题

它会因为传的参数的不同，产生不同的结果

// 传不止一个参数
let arr = new Array(1,2)
console.log(arr);        // [1,2]

// 传一个参数
let arr = new Array(3)
console.log(arr);      // 长度为3的空数组

如果想达成这样的效果: 传什么参数就输出参数构成的数组，那么就可以使用Array.of()

let arr = Array.of(3)
console.log(arr);    // [3]

各种数据拼成一个数组

let arr = Array.of(1,true,'lee',[1,2,3],{
    name: 'wang'
})
console.log(arr);

copyWithin()

用数组中的一些元素替换数组中另外一些元素的时候使用，接受3个参数

copyWithin(startIndex,start，end)

startIndex 从哪个下标开始替换数据(被替换元素的开始下标)
start：可选从这个位置开始读取元素
end: 可选从这个位置结束读取元素，如果不传就表示到末尾

let arr = [1,2,3,4,5]
console.log(arr.copyWithin(1,3));  //  [1, 4, 5, 4, 5]

把下标为3的元素到下标结束的元素替换到下标为1的元素,由于下标为3的到下标结束共2个元素，因此2,3被替换为4,5

fill()

fill(data,startIndex,endIndex)接收三个参数

第一个参数是即将要填充的数据
第二个参数是填充时开始的位置,默认值是0
第三个参数是填充时结束的位置(不包括下标为endIndex的元素)，默认是结束位置

填充数组中的数据作为初始值

// new Array(3) 结果是长度为3的空数组
let arr = new Array(3).fill(7)
console.log(arr);          // [7,7,7]


let arr = [1,2,3,4,5]
arr.fill('hello',1,3)
console.log(arr);        // [1, 'hello', 'hello', 4, 5]

includes()

用来检测数组中是否包含某个元素

indexOf()存在的问题

indexOf可以检测当前数组是否包含某个元素，如果有就返回该元素的下标，如果没有就返回-1

但是indexOf()发现不了NaN

let arr = [1,2,3,NaN]
console.log(arr.indexOf(NaN));      // -1

但是使用inclues()可以

let arr = [1,2,3,NaN]
console.log(arr.includes(NaN));   // true

ES6 - 数组的拓展