什么是类数组

对象是类数组常见情况

对象是类数组的情况
- 函数参数对象 arguments
- 用 getElementsByTagName/Classname/Name 获得的 HTMLCollection
- 用 querySelector 获得的 NodeList
函数参数对象 arguments 特点
- Object.prototype.toString.call 返回 [object arguments]，代表不是数组
- 具有 length 属性
- callee 属性：获取当前的函数
用 getElementsByTagName/Classname/Name 获得的 HTMLCollection
- Object.prototype.toString.call 返回 [object HTMLFormElement]，代表不是数组
- HTML DOM 对象的一个接口，包含获取到的 DOM 元素集合类
- DOM 更新时会实时更新
用 querySelector 获得的 NodeList
- Object.prototype.toString.call 返回 [object NodeList]，代表不是数组
- 实时更新

类数组应用场景

遍历函数参数
定义链接字符串函数

function myConcat(separa) {
  let args = Array.prototype.slice.call(arguments, 1)
  return args.join(separa)
}
console.log(myConcat(', ', 'red', 'orange', 'blue'))

函数间传递参数

function foo(a, b, c) {
  console.log(a, b, c)
}
// 通过 apply 方法传递函数参数
function bar() {
  foo.apply(this, arguments)
}
bar(1, 2, 3) // 1 2 3

类数组转化为数组的方式

借用数组方法转化为数组

let arrayLike = {
  0: 'java',
  1: 'script',
  length: 2,
}

// 借用 push 方法
Array.prototype.push.call(arrayLike, 'wujie')
console.log(arrayLike) // { '0': 'java', '1': 'script', '2': 'wujie', length: 3 }

借用 ES6 展开运算符或 Array.from 转化为数组

function sum(a, b) {
  // 通过展开运算符将类数组转化为数组，从而可以使用数组方法，Array.from 有类似效果
  const args = [...arguments]
  return args.reduce((sum, cur) => sum + cur)
}

console.log(sum(1, 2)) // 3

Tags

对象是类数组常见情况

类数组应用场景

类数组转化为数组的方式