《类数组对象介绍》


2020-05-30 上次更新时间:8/4/2020, 8:24:44 PM 0 javascript

# 介绍

类数组:是一种类似数组的对象,并提供了一种用于访问原始二进制数据的机制,但不是真正的数组。

js 中类数组对象有很多,例如argumentsNodeListHTMLCollectionjQuery

MDN - JavaScript 类型化数组

# 对象特性

# 1. 拥有 length 属性

var a = document.getElementsByTagName("div");
a.__proto__; // HTMLCollection {} 属于类数组对象
a.length; // 44
1
2
3

# 2. 可以使用数字下标方式访问对象

a[0]; // <div id="app">...</div>
1

# 3. 不能使用数组原型方法,如slice、pop等

a.slice; // undefined
1

# 4. 使用 instanceof 操作不属于 Array

a instanceof Array; // false
a instanceof Object; // true
1
2

# 5. 可以被转换为真数组

Array.prototype.slice.call()

var arr = Array.prototype.slice.call(a)
arr instanceof Array; // true
1
2

Array.from()

var arr = Array.from(a)
arr instanceof Array; // true
1
2

# 6. 可自定义其他属性

a.name = 'div集合';
1

# 创建对象

// 1. 创建空对象
var array_like = {};

// 2. 添加下标属性
array_like[0] = 'a';
array_like[1] = 'b';

// 3. 添加length属性 和 push 属性
array_like.length = 2;
array_like.push = Array.prototype.push;

// 4. 调用下
array_like.push('c')

// 5. 检测
console.log(array_like[2]) // c
console.log(array_like.length) // 3
console.log(array_like instanceof Array) // false

// 6. 转换为真数组
var arr = Array.prototype.slice.call(array_like);
arr instanceof Array; // true

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
上次更新时间: 8/4/2020, 8:24:44 PM