TypeScript Array.prototype.map 声明

Posted 2023-03-31

【中文标题】TypeScript Array.prototype.map 声明

【英文标题】：TypeScript Array.prototype.map declaration

【发布时间】：2017-06-16 23:44:40

【问题描述】：

规格

根据MDN specification for Array.prototype.map()的映射应该这样使用...

var new_array = arr.map(callback[, thisArg])

问题

TypeScript 有几个 map 的重载声明，这使得extend Array<T> 变得非常困难。

我希望看到这个（在 lib.d.ts 中）...

map<U>(callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): U[];

但是 lib.d.ts 也有这些...

map<U>(this: [T, T, T, T, T], callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): [U, U, U, U, U];

map<U>(this: [T, T, T, T], callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): [U, U, U, U];

map<U>(this: [T, T, T], callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): [U, U, U];

map<U>(this: [T, T], callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): [U, U];

反对

由于 javascript 不允许方法重载，TypeScript 也不允许用于类实现，我认为 TypeScript 也不应该允许这种环境声明。

问题

为什么 TypeScript 允许环境声明的重载签名？ 如何在扩展 Array 的类中覆盖地图实现？

我也在 GitHub 上提出了这个问题... https://github.com/Microsoft/TypeScript/issues/13785

注意

ReadonlyArray<T>只有一个map的签名，就是……

 map<U>(callbackfn: (value: T, index: number, array: ReadonlyArray<T>) => U, thisArg?: any): U[];

【问题讨论】：

有趣的是，您没有询问 IMO 在这里最重要的方面是什么：目的。正如“为什么首先定义所有这些重载签名？”——答案是这样的事实，TypeScript 具有元素数量有限的数组的类型概念，例如[number, number, number] 是一个三元素number[]。这对于 to 和 from number[] 都是可赋值的，但从编译器的角度来看，它并不精确相同。此外，这些在某些情况下也称为元组类型，并且可以定义不必要的可相互分配的元素类型。

@JohnWeisz 我得到了 n 元素数组的概念，但是为什么这个概念在这方面停留在 5 元素数组上呢？ n 肯定是无限的吗？

【参考方案1】：

(1) 如果不允许在环境声明中重载签名，您将如何在本机 js 函数/方法中获得不同的签名？lib.d.ts 中有很多重载，反映了原生 js 对象是如何工作的。

(2) 你需要告诉编译器你覆盖了所有可能的声明签名。 在您的情况下，您可以执行以下操作：

class A<T> extends Array<T> 
    map<U>(this: Array<U>, ...args: any[]);
    map<U>(this: Array<T>, callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): U[] 
        return [];
    

第一个重载签名会处理您不想打扰的那些。

【参考方案2】：

您的问题涉及 TypeScript 的不同方面。我会单独处理它们，然后将它们放在一起。

数组

接口在 TypeScript 中有双重用途：

它们允许您为其他（尚不存在的）类创建“真正的”接口来实现。当您实现它时，您必须完全实现它，因为该接口保证其所有成员都可用。 它们允许您定义已经存在 javascript 类型的接口。当您想使用众多现有库之一并且仍然具有静态类型的优势时，这非常有用。这些接口通常在.d.ts 文件中定义（并且lib.d.ts 文件包含基本的JavaScript 类型）。这些接口是为现有类型量身定制的，它们通常不适合您实现。如果你愿意，你可以，但你必须实现它的所有成员。

Array<T> 接口属于第二种类型，因此不适合您实现。

this函数中的参数

函数定义中的this: 参数不是真正的参数，因为您可以传递参数。它允许您指定您希望函数体中的 this 值是哪种类型。如果不指定，this 将是 any 类型，这通常不是很有用。

函数/方法重载

在 TypeScript 中，函数和方法在 Java 或 C# 等语言中不会被重载。您不能多次实现它，但您可以定义替代签名以允许对返回变体类型或使用变体参数的函数进行静态类型化。尤其是在.d.ts 定义文件中，这很有用而且通常是必要的，因为现有库使用 JavaScript 的弱类型来返回值或期望不同类型的参数。这使您的反对意见错误。您需要函数重载来适应这些 JavaScript 结构。

元组

在 JavaScript 数组中，您可以在其每个插槽中分配多种类型的值。在 TypeScript 数组定义中，您指定 one 类型，这是编译器强制执行的。为了填补空白，您可以定义 元组。 [number, string, string] 这样的类型转换为 JavaScript 数组 any[]，TypeScript 仍然可以强制执行静态类型。

总结

如果数组是实际的[T, T]、[T, T, T]、[T, T, T, T]、[T, T, T, T, T]，则数组方法会重载您在Array<T> 中反对的对象，从而引入静态类型的this 参数。这并不意味着该数组提供了多个map 方法。它是相同的方法，但对某些特定的数组类型进行了重载。它在lib.d.ts 中提供，因此并非旨在由您实现。您可以扩展底层类（即使没有接口也已经存在），但重载不会伤害您（至少在这种情况下不会，因为它们只提供this 参数）。

【讨论】：

Array 实际上是一个可以扩展的类，在发布此答案之前您应该检查一下。 OP 可能知道您所有冗长的解释（基于他询问的内容和询问方式）。

@NitzanTomer：我查过（github.com/Microsoft/TypeScript/blob/master/lib/lib.d.ts - 搜索“interface Array ”），你似乎比我更了解 OP。

您还会看到，在 interface Array<T> 之后是 interface ArrayConstructor，它定义了构造函数，然后是 declare const Array: ArrayConstructor，它使 Array 成为一个类。

但不仅如此，只需尝试编译 class MyArray<T> extends Array<T> 并查看它是否有效。

@NitzanTomer：我会更正那部分，但从我在帖子中描述的意义上说，它是一个接口。 class 已经存在，interface 只是定义了它的成员。