2021-3-17 类数组和数组的区别,dom的类数组如何转换成
2021-03-18 本文已影响0人
威少带我砍三双
1)定义
数组是一个特殊对象,与常规对象的区别:
1.当由新元素添加到列表中时,自动更新length
属性
2设置length属性,可以截断数组
3.从Array.protoype中继承了方法
4.属性为'Array'
类数组是一个拥有length属性,并且他属性为非负整
数的普通对象,类数组不能直接调用数组方法。
2)区别
本质:类数组是简单对象,它的原型关系与数组不同。
// 原型关系和原始值转换
let arrayLike = {
length: 10,
};
console.log(arrayLike instanceof Array); // false
console.log(arrayLike.__proto__.constructor === Array); // false
console.log(arrayLike.toString()); // [object Object]
console.log(arrayLike.valueOf()); // {length: 10}
let array = [];
console.log(array instanceof Array); // true
console.log(array.__proto__.constructor === Array); // true
console.log(array.toString()); // ''
console.log(array.valueOf()); // []
3)类数组转换为数组。转换方法
1.使用Array.from()
2.使用Array.prototype.slice.call()
3.使用Array.prototype.forEach()进行属性遍历并组成新的数组
。转换须知
。转换后的数组长度由length属性决定。索引不连续时转换结果是连续的,会自动补位。
。代码示例
let al1 = {
length: 4,
0: 0,
1: 1,
3: 3,
4: 4,
5: 5,
};
console.log(Array.from(al1)) // [0, 1, undefined, 3]
。②仅考虑0或正整数的索引
// 代码示例
let al2 = {
length: 4,
'-1': -1,
'0': 0,
a: 'a',
1: 1
};
console.log(Array.from(al2)); // [0, 1, undefined, undefined]
③使用slice转换产生稀疏数组
// 代码示例
let al2 = {
length: 4,
'-1': -1,
'0': 0,
a: 'a',
1: 1
};
console.log(Array.prototype.slice.call(al2)); //[0, 1, empty × 2]
4)使用数组方法操作类数组注意地方
let arrayLike2 = {
2: 3,
3: 4,
length: 2,
push: Array.prototype.push
}
// push 操作的是索引值为 length 的位置, 所以下面的2对应1, 之后length变3, push(2) 之后 3对应 2
arrayLike2.push(1);
console.log(arrayLike2); // {2: 1, 3: 4, length: 3, push: ƒ}
arrayLike2.push(2);
console.log(arrayLike2); // {2: 1, 3: 2, length: 4, push: ƒ}