TypeScript 学习笔记

[hoperyy]

• 细节

  interface SquareConfig {
      a: string;
      b: string
  }
  
  function fn(config: SquareConfig) {
      // console.log(config.c); // 访问不存在的属性会报错
  }
  
  // 字面量：在定义范围内
  // let result = fn({ a: 'a', b: 'b' });
  
  // 变量：必须包含定义
  let obj = { a: 'a', b: 'b' };
  let result2 = fn(obj);
  
  

  interface ClockInterface {
      currentTime: Date;
      setTime(d: Date); // 方法的定义
  }
  
  class Clock implements ClockInterface {
      currentTime: Date; // 分号
      setTime(d: Date) {
          this.currentTime = d;
      }
      constructor(h: number, m: number) {}
  }
  

[hoperyy]

TypeScript

基本类型

• 数组

  • let list: number[] = [1, 2, 3]
  • let list: Array<number> = [1, 2, 3]
  • let list: [string, number] = ['hello', 2]
    • 越界的元素使用联合类型：string | number

• 枚举

  enum Color { Red = 1, Green, Blue }

  • Color 可以作为一个对象使用
    • Color[1] 为 'Red'
    • Color.Red 为 1
  • 索引从 0 开始，如果不赋值会累加

• void

  声明一个 void 类型的变量没有什么大用，因为你只能为它赋予 undefined 和 null

• null / undefined 有这两个类型。

  • null / undefined 可以赋值给这两个类型。
  • null / undefined 默认是其他类型的子类型，也可以赋值给其他类型，除非指定 --strictNullChecks 标记，这时只能赋值给 void / null / undefined

• never

  • never 类型表示的是那些永不存在的值的类型
    • never 类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型
    • 变量也可能是 never 类型，当它们被永不为真的类型保护所约束时。
  • never 类型是任何类型的子类型，也可以赋值给任何类型
  • 然而，没有类型是 never 的子类型或可以赋值给 never 类型（除了 never 本身之外）。 即使 any 也不可以赋值给 never。

类型断言

通过类型断言这种方式可以告诉编译器，“相信我，我知道自己在干什么”

它没有运行时的影响，只是在编译阶段起作用。 TypeScript会假设你，程序员，已经进行了必须的检查。

• 写法 1

  let someValue: any = "this is a string";
  
  let strLength: number = (<string>someValue).length;

• 写法 2

  let someValue: any = "this is a string";
  
  let strLength: number = (someValue as string).length;

接口

• 描述对象

  接口写法：

  interface Point {
      x: number;
      y: number;
  }

  • 可选

    interface Point {
        x?: number;
        y?: number;
    }

  • 只读（只允许在初始化的时候赋值）

    interface Point {
        readonly x: number;
        readonly y: number;
    }

    数组有 ReadonlyArray<T> 类型

• 额外的属性检查

  对象字面量会进行额外的属性检查。如果一个对象字面量存在任何“目标类型”不包含的属性时，你会得到一个错误。

  绕开检查：

  • 使用类型断言

    let mySquare = createSquare({ width: 100, opacity: 0.5 } as SquareConfig);

  • 最佳的方式是能够添加一个字符串索引签名

    interface SquareConfig {
        color?: string;
        width?: number;
        \[propName: string\]: any;
    }

  • 将这个对象赋值给一个另一个变量

    let squareOptions = { colour: "red", width: 100 };
    let mySquare = createSquare(squareOptions);

• 描述函数

  interface SearchFunc {
      (source: string, subString: string): boolean;
  }

  参数：返回值
  

  参数名不会检查

• 描述可索引的类型

  interface StringArray {
      \[index: number\]: string;
  }
  
  let myArray: StringArray;
  myArray = ["Bob", "Fred"];
  
  let myStr: string = myArray[0];

  描述了索引的类型、值的类型。

  interface NumberDictionary {
      \[index: string\]: number;
      length: number;    // 可以，length是number类型
      name: string       // 错误，`name`的类型与索引类型返回值的类型不匹配
  }

  索引可以设置为只读

  interface ReadonlyStringArray {
      readonly \[index: number\]: string;
  }
  let myArray: ReadonlyStringArray = ["Alice", "Bob"];
  myArray[2] = "Mallory"; // error!

• 类接口

  和类一样，接口也可以相互继承。

  interface Shape {
      color: string;
  }
  
  interface Square extends Shape {
      sideLength: number;
  }
  
  let square = <Square>{};
  square.color = "blue";
  square.sideLength = 10;

  一个接口可以继承多个接口

  interface Square extends Shape, PenStroke {
      sideLength: number;
  }

  类接口可以继承类

类

• 尽管 Employee 里也有一个私有成员 name，但它明显不是 Animal 里面定义的那个。

  赋值也会进行类型检查。

函数

• 函数的类型只是由参数类型和返回值组成的。 函数中使用的捕获变量不会体现在类型里。

• 两种指定函数类型的方法

  // myAdd has the full function type
  let myAdd = function(x: number, y: number): number { return x + y; };
  
  // The parameters `x` and `y` have the type number
  let myAdd: (baseValue: number, increment: number) => number =
      function(x, y) { return x + y; };

枚举

enum Response {
    No = 0,
    Yes = 1,
}

function respond(recipient: string, message: Response): void {
    // ...
}

respond("Princess Caroline", Response.Yes)

枚举可以作为一个对象使用

• 数字枚举
• 字符串枚举
• 异构枚举（不建议）

泛型