伪数组转换为真数组

# 伪数组转换为真数组

# 什么是伪数组

伪数组也称类数组。像arguments 或者获取一组元素返回的集合都是伪数组。伪数组如何转换成真正数组，其实我们很少去这么做，但是那帮面试官可能会问，并且不止一种方法让你去实现

# 常见的伪数组

参数数组：arguments
DOM对象列表HTMLCollection()：比如通过document.getElementsByTagName得到的列表
jquery对象：比如$("div")

// 伪数组是一个Object，而真实的数组是一个Array
console.log(list instanceof Array);  // false
console.log(list instanceof Object);  // true

// 拥有length属性和数值下标属性
// 伪数组没有真实数组的方法
list.forEach((ele) => console.log(ele))  // list.forEach is not a function

1
2
3
4
5
6
7

下面来看看，怎么转为正常的数组

# slice方法

Array.prototype.slice.call(list) && [].slice.call(list)

使用数组的slice()方法它返回的是数组，使用call或者apply指向伪数组，其内部实现原理，也就是for循环本身

Array.prototype.slice = function (start, end) {
  start = start || 0
  end = start || this.length
  const arr = []
  for (var i = start; i < end; i++) {
    arr.push(this[i])
  }
  return arr
}

1
2
3
4
5
6
7
8
9

# concat.apply

拼接成新的数组 Array.prototype.concat.apply([], list)

# Array.form() 扩展运算符

ES6果然是简洁、强大的存在

[...list]           // 扩展运算符
Array.from(list)    // from

1
2

# for 循环

当然，最原始的方法就是再创建一个数组，用for循环把类数组的每个属性值放在里面，不管是对象还是数组，仍是无所不能

let arr = [];
for(let i = 0; i < list.length; i++){
    arr.push(list[i])
}

1
2
3
4

# 原型继承

← 判断数组中是否包含某个值数组中强大的reduce→