学习 TS 过程中的特殊记录

枚举类型

我们知道在 Typescript 中新增了枚举类型，我们不需要关注它支持的诸如默认索引或者自定义索引等内容，只需要关注其本身的定义和向 js 代码的转义

例如，我们定义一个 Tree1：

enum Tree1 {
    branch0,
    branch1,
    branch2,
    branch3
}

此时我们将其转换为 js 代码后，发现其定义过程为：

var Tree1;
(function (Tree1) {
    Tree1[Tree1["branch0"] = 0] = "branch0";
    Tree1[Tree1["branch1"] = 1] = "branch1";
    Tree1[Tree1["branch2"] = 2] = "branch2";
    Tree1[Tree1["branch3"] = 3] = "branch3";
})(Tree1 || (Tree1 = {}));

可以看到，我们在 Tree1 中定义了四个枚举值，在转义成 js 代码后，为最终的 Tree1 对象挂上了 8 个属性

浏览器的视角：

解构赋值

譬如我们想要在函数定义的形参列表中使用结构赋值，并标识其类型，可能会想到这样做：

// error!!!
function test ({ prop1: string, prop2 }) {}

这样的话，后续的 : string 会被认为是 prop1 的值。

正确的做法是在解构赋值之前，使用 type 或者 interface 定义完善后，再进行解构：

// 这里以 interface 为例
interface IPropsMap {
    prop1: string
    prop2: number
}

function test ({ prop1, prop2 }: IPropsMap) {
    // do sth...
}

函数签名

我们在声明接口，或者抽象类的声明时，会涉及到一个函数签名的概念，也可以叫做方法签名：

interface IFnSignature {
    getValueList (type: string, limit: number): Array<Value>
}

其中包含的信息有：

1. 参数列表，包含形参的名字、类型
2. 返回值类型

例如在类实现某个接口的时候，就需要保证类中的方法签名和接口中的完全相同。例如：

上图代表我们 CFnDemo 类中的 getValueList 方法的函数签名不同，在编译期便指出了我们的错误。