什么是类数组
对象是类数组常见情况
-
对象是类数组的情况
- 函数参数对象 arguments
- 用
getElementsByTagName/Classname/Name获得的 HTMLCollection - 用
querySelector获得的 NodeList
-
函数参数对象 arguments 特点
Object.prototype.toString.call返回[object arguments]，代表不是数组- 具有 length 属性
- callee 属性：获取当前的函数
-
用
getElementsByTagName/Classname/Name获得的 HTMLCollectionObject.prototype.toString.call返回[object HTMLFormElement]，代表不是数组- HTML DOM 对象的一个接口，包含获取到的 DOM 元素集合类
- DOM 更新时会实时更新
-
用
querySelector获得的 NodeListObject.prototype.toString.call返回[object NodeList]，代表不是数组- 实时更新
类数组应用场景
- 遍历函数参数
- 定义链接字符串函数
1function myConcat(separa) {
2 let args = Array.prototype.slice.call(arguments, 1)
3 return args.join(separa)
4}
5console.log(myConcat(', ', 'red', 'orange', 'blue'))- 函数间传递参数
1function foo(a, b, c) {
2 console.log(a, b, c)
3}
4// 通过 apply 方法传递函数参数
5function bar() {
6 foo.apply(this, arguments)
7}
8bar(1, 2, 3) // 1 2 3类数组转化为数组的方式
- 借用数组方法转化为数组
1let arrayLike = {
2 0: 'java',
3 1: 'script',
4 length: 2,
5}
6
7// 借用 push 方法
8Array.prototype.push.call(arrayLike, 'wujie')
9console.log(arrayLike) // { '0': 'java', '1': 'script', '2': 'wujie', length: 3 }- 借用 ES6 展开运算符或
Array.from转化为数组
1function sum(a, b) {
2 // 通过展开运算符将类数组转化为数组，从而可以使用数组方法，Array.from 有类似效果
3 const args = [...arguments]
4 return args.reduce((sum, cur) => sum + cur)
5}
6
7console.log(sum(1, 2)) // 3