共计 988 个字符,预计需要花费 3 分钟才能阅读完成。
- 伪数组
一种相似数组的对象,它们不具备数组的规范办法,然而作为可迭代对象能够对它们像数组一样进行迭代,常见的伪数组对象:
- NodeList(dom.querySelectorAll 等获取)
- Arguments 对象
- FileList 对象
- String 对象
const foo = (a,b,c) => arguments;
const args = foo(1,2,3,4);
for(let item of args) {console.log(item);
}
// 1
// 2
// 3
// 4
// 测验 arguemnts 对象类型
args instanceof Object; // true
Object.prototype.toString.call(args); // "[object Arguments]"
- 手动创立伪数组对象
const arrayLike = {
1: "AAA",
3: "CCC",
5: "BBB",
length: 6
};
// 复用数组办法
[].forEach.call(arr, (item, i) => console.log(item, i));
// AAA 1
// CCC 3
// BBB 5
对于数组和伪数组,在数组的规范办法中,只有 concat 办法是不通用的
console.log([].concat.call(arr, [7, 8])); // [{ '1': 'AAA', '3': 'CCC', 5: "BBB", length: 6}, 7, 8 ]
console.log([1, 2].concat([7, 8])); // [1, 2, 7, 8]
// 解决方案
1. slice
[].concat.call([].slice.call(arr), [7, 8]);
2. Symbol.isConcatSpreadable
arr[Symbol.isConcatSpreadable] = true;
[].concat.call(arr, [7, 8]);
// [empty, "AAA", empty, "CCC", empty, "BBB", 7, 8]
- 伪数组对象和数组的转换
- Array.from
- 扩大运算符
- Object.entries
console.log(Array.from(args)); // [1,2,3,4]
console.log([...args]); // [1,2,3,4]
console.log(Object.entries(args).map(([,val]) => val)); // [1,2,3,4]
正文完
发表至: javascript
2021-06-03