2022-09-27JavaScript00
请注意,本文编写于 179 天前,最后修改于 179 天前,其中某些信息可能已经过时。

1)定义

  • 数组是一个特殊对象,与常规对象的区别:

      1. 当由新元素添加到列表中时,自动更新length属性
      1. 设置length属性,可以截断数组
      1. 从Array.protoype中继承了方法
      1. 属性为'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()
      1. 使用 Array.prototype.slice.call()
      1. 使用 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 的位置
  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: ƒ}

本文作者:前端小毛

本文链接:

版权声明:本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!