子类化 JavaScript 数组 - 构造函数参数不传递给数组

Question

我想继承一个 javascript 数组并将构造函数参数传递给数组。我所拥有的是：

function SubArray(arguments) {
    Array.apply(this, arguments);
}

SubArray.prototype = Array.prototype;

测试不表明参数正在传递给数组

var x = new SubArray("One", "Two", "Three");
// Object[]
// x.length = 0

而当我使用数组执行此操作时，我得到了这个

var x = new Array("One", "Two", "Three");
// Object["One", "Two", "Three"]
// x.length = 3

我做错了什么？

Answer 1

ES6

在 ES6 中，您可以使用 class 语法扩展 Array

class SubArray extends Array {
    constructor() {
        super(...arguments);
    }
    first() {
        return this[0];
    }
}

长度将按预期工作

var sa = new SubArray('foo', 'bar');
sa[2] = 'baz';
sa.length; // 3
sa.first(); // "foo"
sa instanceof SubArray; // true

---

ES5 之前

在 ES5 之前（包括 ES5），无法在不丢失功能的情况下以通常的构造函数原型方式干净地扩展 Array，而是必须向 Array 实例添加属性

function SubArray() {
    var arr = Array.apply(null, arguments);
    arr.first = function () {return this[0];};
    return arr;
}

使用它不再需要new，因为从函数返回Object，instanceof 将无法确定SubArray。

var sa = SubArray('foo', 'bar');
sa[2] = 'baz';
sa.length; // 3
sa.first(); // "foo"
sa instanceof SubArray; // false -- this gets broken

---

ES5（慢）

在行为比速度更重要的 ES5 环境中，您可以根据需要使用 Object.setPrototypeOf (see MDN warning) 强制原型链，这“有点小技巧”看起来像 p>

function SubArray() {
    var arr = Array.apply(null, arguments);
    Object.setPrototypeOf(arr, SubArray.prototype);
    return arr;
}
SubArray.prototype = Object.create(Array.prototype);
SubArray.prototype.first = function () {return this[0];};

同样，new 不再需要，但这次实例的行为与正常扩展时的预期行为完全相同。

var sa = SubArray('foo', 'bar');
sa[2] = 'baz';
sa.length; // 3
sa.first(); // "foo"
sa instanceof SubArray; // true