用函数创建自己的类型

Question

我正在尝试创建我自己的类型，在这些类型上我可以使用dot syntax调用函数。

例如：

let myOwnType: myByteType = 123211345;
myOwnType.toHumanReadable(2);

我想存档相同的行为，如数字、数组等。我不想使用调用签名或构造函数签名创建我的类型

因此，在查看了打字本libary之后，我看到了这个数字界面：

interface Number {
    /**
     * Returns a string representation of an object.
     * @param radix Specifies a radix for converting numeric values to strings. This value is only used for numbers.
     */
    toString(radix?: number): string;

    /**
     * Returns a string representing a number in fixed-point notation.
     * @param fractionDigits Number of digits after the decimal point. Must be in the range 0 - 20, inclusive.
     */
    toFixed(fractionDigits?: number): string;

    /**
     * Returns a string containing a number represented in exponential notation.
     * @param fractionDigits Number of digits after the decimal point. Must be in the range 0 - 20, inclusive.
     */
    toExponential(fractionDigits?: number): string;

    /**
     * Returns a string containing a number represented either in exponential or fixed-point notation with a specified number of digits.
     * @param precision Number of significant digits. Must be in the range 1 - 21, inclusive.
     */
    toPrecision(precision?: number): string;

    /** Returns the primitive value of the specified object. */
    valueOf(): number;
}

问题是，我无法找到函数体的定义位置和方式。我在想，一定有一个实现接口的类，或者类似的东西。

我想要做这样的事：

interface Bytes {
  toHumanReadable(decimals: number): bytesToHumanReadable;
  bytesAs(unit: string): string;
}


function bytesToHumanReadable (decimals: number) {
  // convert bytes to GB, TB etc..
}

我如何创建我自己的类型，并使用它们就像一个正常的类型？我知道接口也不起作用，但这是我的第一次猜测。

Answer 1

问题是，我无法找到函数体的定义位置和方式。

它们由JavaScript引擎定义，作为标准库的一部分。你会在Number.prototype上找到他们。下面是它的工作原理:当您尝试访问原语(例如，someNumber.toString())上的属性时，JavaScript引擎将在该原语的对象类型的原型(number => Number、string => String等)上查找该属性。如果您正在调用，它将调用该方法，传入原语(在严格模式下)或传递原语的对象包装器(在松散模式下)。

您不能定义您自己的基本类型，这只能在JavaScript规范级别上进行。

您可以创建一个Byte类并拥有它的实例，但是它们是对象，而不是原语。

class Byte {
    constructor(public value: number) {
    }
    yourMethodHere() {
        // ...
    }
}

您也可以将方法添加到Number.prototype中，尽管最好不要在您可能与其他人共享的任何库代码中这样做。(在您自己的应用程序或页面中，大多数情况都很好，只是要确保使用标准库的未来功能不太可能使用的名称。)

例如，这将向数字添加一个toHex方法：

// Adding it to the type
interface Number {
    toHex(): string;
}
// Adding the implementation
Object.defineProperty(Number.prototype, "toHex", {
    value() {
        return this.toString(16);
    },
    enumerable: false, // This is the default, but just for emphasis...
    writable: true,
    configurable: true
});

操场上活生生的例子

Answer 2

T.J.克劳德的好答案--我对此作了一些扩展

 interface myByteType extends Number {
      toHumanReadable?(): string;
     }

    // Adding the implementation
    Object.defineProperty(Number.prototype, "toHumanReadable", {
      value() {
          return this.toString(16);
      },
      enumerable: false, // This is the default, but just for emphasis...
      writable: true,
      configurable: true
    });

    let a: myByteType = 2124;
    a.toHumanReadable();

使用问题标记语法，您可以在定义的函数中使用您自己的类型！

Answer 3

您已经在使用bytesToHumanReadable函数的过程中，但是缺少了一件关键的事情。

由于您希望向numbers添加新功能，所以您必须扩展基本的NumberConstructor接口并自己实现该功能。让我们来看看这个在实践中。

interface myByteType extends NumberConstructor = {
 toHumanReadable: (decimals: number): string
}

这只是为了满足TypeScript编译器。您仍然必须通过扩展Number原型来实现这个功能，如下所示：

Number.prototype.toHumanReadable = function(decimals: number) {
 // convert bytes to GB, TB etc.. 
}

然后，您可以对扩展toHumanReadable接口的任何变量使用myByteType函数，如下所示：

const secondsSinceOpened: myOwnType = 1334244200

secondsSinceOpened.toHumanReadable(2)

这个问题非常类似于这一个，因此您可以检查它以供进一步阅读。