【笔记19】Javascript - 类数组-CFANZ编程社区

【笔记19】Javascript - 类数组

类数组

1，可以利用属性名模拟数组的特性；

2，可以动态的增长length属性；

3，如果强行让类数组调用 push 方法，则会根据 length 属性值的位置进行属性的扩充。

看个情况：

function test(){
    console.log(arguments);
}
test(1,3,4,5,6);

看结果：

【笔记19】Javascript - 类数组_类数组

结果看起来就像个数组，那给他push个数据看看？

function test(){
    console.log(arguments);
    arguments.push(7);
}
test(1,3,4,5,6);

【笔记19】Javascript - 类数组_类数组_02

又报错，说明看起来像，但不是。

再来看情况：

var obj = {
    "0": "a",
    "1": "b",
    "2": "c",
    "length": 3,
    "push": Array.prototype.push
}

来看下控制台：

【笔记19】Javascript - 类数组_类数组_03

奇怪的情况发生了，明明是个对象，这样就具备数组的特性，即能 push 进数据，还改变了 length 的值。

类数组的特点：属性要为索引(数字)属性，必须有length属性，最好加上push。

如果再加上 splice 属性就更像了。

var obj = {
    "0": "a",
    "1": "b",
    "2": "c",
    "length": 3,
    "push": Array.prototype.push,
    "splice": Array.prototype.splice
}

看下控制台：

【笔记19】Javascript - 类数组_类数组_04

这样就更像数组了，那么，像数组能不能当数组那样用呢？可以。

先来看一下数组里的 push 是怎么实现的，只模拟 push 传一个参数的情况：

Array.prototype.push = function(target){
    obj[obj.length] = target;
    obj.length ++;
}

当年有个题是这样的：

var obj={
    "2":"a",
    "3":"b",
    "length":2,
    "push":Array.prototype.push
}

Array.prototype.push = function(target){
    obj[obj.length] = target;
    obj.length ++;
}

现在问：

obj.push("c");
obj.push("d");

是什么结果。

【笔记19】Javascript - 类数组_数组_05

obj[obj.length] = target;    // 相当于 obj[2] = "c"

代入一个 push("c") ，相当于 ojb[2] = "c"；就把原数组的值替换了。

分析完了类组的性质，来看下应用：

var obj={
    "0" : "a",
    "1" : "b",
    "2" : "c",
    name: "abc",
    age : 20,
    length: 3,
    push: Array.prototype.push,
    splice:Array.prototype.splice    
}
obj.push("d");