filter() 有问题，当我扩展数组 class

Question

我认为在 javascript 中扩展 Arrays 会很有用，以使用一些自定义方法和业务逻辑来增强它们。 到目前为止，它运行良好，直到我尝试过滤我的实例。

似乎数组filter方法使用一个参数调用我的构造函数（如果没有找到，则为0 ）并返回一个新实例。 不是我所期望的。

 class MyArray extends Array { constructor(x, y, z) { super(x, y, z); // do custom stuff } } let numbers = new MyArray(1, 2, 3); console.log(numbers.filter((v) => v === 0));

但是，如果我将一些 arguments 传递并传播到单个变量中，一切正常。

从技术上讲，我认为两者之间没有区别，我不明白！

 class MyArray extends Array { constructor(x, ...args) { super(x, ...args);; // do custom stuff } } let numbers = new MyArray(1, 2, 3); console.log(numbers.filter((v) => v === 0));

1. 为什么第一种方法会遇到这个问题？
2. 为什么第二种方法不会遇到这种情况？

（扩展 Arrays 或其他核心 js 类是不好的做法吗？）

Answer 1

Array构造函数的行为取决于它接收到的 arguments 的数量和类型。

如果它接收到包含 integer 的单个参数，则此参数是数组的初始大小。 它返回一个该大小的数组，其中元素未初始化。

在其他情况下，arguments 是数组的初始元素。

因此，当您调用super(x, y, z)时，您使用的是第二种格式，它会创建一个最初包含值x, y, z的数组。

filter()使用第一种格式调用您的构造函数，因此x是它请求的数组的大小（如您所说的0 ）。 但是您的构造函数有额外的 arguments y和z ，所以它们被设置为undefined 。 所以你正在调用super(0, undefined, undefined) ，它正在创建一个数组[0, undefined, undefined] 。

您的第二个构造函数几乎是正确的，但是可以在没有 arguments 的情况下调用真正的Array构造函数，返回一个空数组。 如果以这种方式调用构造函数，它将调用super(undefined) ，创建一个包含单个元素的数组undefined 。 定义构造函数的正确方法是使用单个展开参数。 这不会对filter()产生影响，但可能会影响其他代码。

 class MyArray extends Array { constructor(...args) { super(...args);; // do custom stuff } } let numbers = new MyArray(1, 2, 3); console.log(numbers.filter((v) => v === 0));