-
Notifications
You must be signed in to change notification settings - Fork 6
Open
Description
JavaScript 中有一种特殊的数组————伪数组(或称类数组),它和数组很像,都是对象类型,都有 length 属性,但它又不是真正意义上的数组。它是一种以自然递增的整数做为键名,且定义了 length 表示元素个数的对象。
与数组的区别:
- 伪数组没有数组原型链(Array.prototype)上的属性和方法,如
push、slice、map等; - 数组是基于索引的实现,
length会自动更新,而伪数组是基于键值对实现的,本质是对象。
var array = ['Kitty', 'Mike', 'Paul'];
var arrayLike = {
0: 'Kitty',
1: 'Mike',
2: 'Paul',
length: 3
};常见的伪数组有函数内部的 arguments、DOM 对象列表 NodeList、正则表达式 match 方法匹配结果等:
function fn() {
// {0: "a", 1: "b", 2: "c", length: 3, callee: ƒ fn()}
console.log(arguments)
}
fn('a', 'b', 'c');
// {0: body, length: 1}
document.querySelectorAll('body');
document.getElementsByTagName('body');
// {0: "abc123", 1: "123", groups: undefined, index: 0, input: "abc123", length: 2}
'abc123'.match(/[a-z]+(\d+)/);当然我们可以将伪数组转换为数组,使其可以正常使用数组的大部分方法:
var arrayLike = {
0: 'Kitty',
1: 'Mike',
2: 'Paul',
length: 3
};
// 方法1:扩展运算符
[...arrayLike];
// 方法2:创建数组
Array.from(arrayLike);
// 方法3:concat 生成新数组
Array.prototype.concat.apply([], arrayLike)
// 方法4:借用数组方法(此处以 map 方法为例)
Array.prototype.map.call(arrayLike, function(item) {
// 遍历数组项
});
// 方法5:借用数组方法精简版
[].prototype.slice(arrayLike);Metadata
Metadata
Assignees
Labels
No labels