如何在 Typescript 4.0.3 中正确扩展 Array 原型？

Question

我正在尝试使用一些自定义方法扩展基本Array 接口。我查看了 SO 和 typescript 文档，最后将以下代码放在一起：

// In module Func.ts

declare global {
  type Array<T> = {
    intersperse(mkT: (ix: number) => T): T[];
  };
}

if (!('intersperse' in Array.prototype)) {
  Array.prototype.intersperse = function intersperse<T>(this: T[], mkT: (ix: number) => T): T[] {
    return this.reduce((acc: T[], d, ix) => [...acc, mkT(ix), d], []).slice(1);
  };
}

但是，我收到以下错误：

// On type Array<T> = { ... }
Duplicate identifier 'Array'.ts(2300)

// On Array.prototype.intersperse = ...
Property 'intersperse' does not exist on type 'any[]'.ts(2339)

另外，每当我尝试在其他文件中使用 intersperse 时，我都会收到错误消息

Property 'intersperse' does not exist on type 'Element[]'.ts(2339)

这是意料之中的，考虑到Func.ts 中的声明似乎不起作用。据此，我认为 SO 问题已经过时（或不完整），并且从那以后发生了一些变化。

那么，为了摆脱这些错误并扩展 Array 原型，最好的扩展方法是什么？在你说我不应该这样做之前——是的，我知道all the risks，而且我还是做出了明智的决定。

Answer 1

Array 被定义为接口而不是类型。 typescript 中的接口是开放式的，可以通过多个声明添加。类型不共享相同的功能。

export{}
declare global {
  interface Array<T>  {
    intersperse(mkT: (ix: number) => T): T[];
  }
}

if (!Array.prototype.intersperse) {
  Array.prototype.intersperse = function intersperse<T>(this: T[], mkT: (ix: number) => T): T[] {
    return this.reduce((acc: T[], d, ix) => [...acc, mkT(ix), d], []).slice(1);
  };
}

Playground Link

作为 T.J. Crowder 提到您可以考虑使用Object.defineProperty 来确保该属性不可枚举：

export {}
declare global {
  interface Array<T>  {
    intersperse(mkT: (ix: number) => T): T[];
  }
}

if (!Array.prototype.intersperse) {
  Object.defineProperty(Array.prototype, 'intersperse', {
    enumerable: false, 
    writable: false, 
    configurable: false, 
    value: function intersperse<T>(this: T[], mkT: (ix: number) => T): T[] {
      return this.reduce((acc: T[], d, ix) => [...acc, mkT(ix), d], []).slice(1);
    }
  });
}

Playground Link