如何在 TypeScript 中扩展 String.prototype

在 TypeScript 中扩展 String.prototype

How to Extend String.prototype in TypeScript

在 TypeScript 中扩展 String.prototype:

  1. 创建一个string.extensions.ts文件。
  2. 扩展String接口,添加扩展方法。
  3. import './string.extensions'像使用之前一样导入扩展方法。

以下是内容string.extensions.ts

字符串.extensions.ts
interface String { prefix(pre: string): string; } String.prototype.prefix = function (pre: string) { return pre + this; };


下面是我们如何在原型上
导入和使用新
prefix方法:String

索引.ts
import './string.extensions'; const str = 'world'; console.log(str.prefix('hello ')); // 👉️ "hello world"

如果我运行我的index.ts文件,我们可以看到该prefix方法被成功调用。

字符串原型扩展

我们声明了一个新接口String,它将与原始String接口合并。

在接口中,我们创建了一个prefix方法,它将前导字符添加到原始字符串并返回结果。

确保在扩展原型时使用命名函数,而不是箭头函数,因为箭头函数使用this封闭范围的 ,这不是您想要的。

您可以使用这种方法来扩展String.prototype任何方法。下面是将传入的字符串相加的方法示例。

这是string.extensions.ts文件中的代码:

字符串.extensions.ts
interface String { add(...strings: string[]): string; } String.prototype.add = function (...strings) { return this + strings.join(''); };

这是index.ts导入string.extensions并使用该add方法的文件。

索引.ts
import './string.extensions'; const str = 'hello'; // 👇️ "hello one two three" console.log(str.add(' one', ' two', ' three'));

确保在导入string.extensions.ts
模块时指定正确的路径。

覆盖时String.prototype,请确保您的方法不会干扰内置方法名称,除非有意覆盖它们(这可能会造成混淆)。

下面是一个如何覆盖内置toLowerCase()
方法的示例。

字符串.extensions.ts
interface String { toLowerCase(): string; } String.prototype.toLowerCase = function () { return this.toUpperCase(); };

这是我们index.ts文件中的代码。

索引.ts
import './string.extensions'; const str = 'Hello World'; // 👇️ "HELLO WORLD" console.log(str.toLowerCase());

请注意,覆盖内置方法会造成混淆,通常应避免使用。

发表评论