如何在 TypeScript 中扩展 Number.prototype

作者

在 TypeScript 中扩展 Number.prototype

How to Extend Number.prototype in TypeScript

在 TypeScript 中扩展 Number.prototype：

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

以下是内容number.extensions.ts：

号码.extensions.ts
interface Number {
  sum(a: number): number;
}

Number.prototype.sum = function (a: number) {
  return Number(this) + a;
};


下面是我们如何在原型上导入和使用新sum方法：Number

索引.ts
import './number.extensions';

const num = 100;

console.log(num.sum(5000)); // 👉️ 5100

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

数字原型扩展

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

在界面中，我们创建了一个sum方法，将 2 个数字相加并返回结果。

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

您可以使用这种方法来扩展Number.prototype任何方法。以下是将前导零添加到数字的方法示例。

这是number.extensions.ts文件中的代码：

号码.extensions.ts
interface Number {
  addLeadingZeros(): string;
}

Number.prototype.addLeadingZeros = function () {
  return padToDigits(Number(this), 5);
};

function padToDigits(num: number, totalLength: number) {
  return num.toString().padStart(totalLength, '0');
}

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

索引.ts
import './number.extensions';

const num = 100;

// 👇️ "00100"
console.log(num.addLeadingZeros());

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

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

原来的Number界面是这样的：

索引.ts
interface Number {
    toString(radix?: number): string;

    toFixed(fractionDigits?: number): string;

    toExponential(fractionDigits?: number): string;

    toPrecision(precision?: number): string;

    valueOf(): number;
}

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

号码.extensions.ts
interface Number {
  toString(): string;
}

Number.prototype.toString = function () {
  return 'hello world';
};

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

索引.ts
import './number.extensions';

const num = 100;

// 👇️ "hello world"
console.log(num.toString());

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

–

发表评论