一、类型

1、数据类型

  1. 1、原始数据类型 
  2. boolean 布尔值
  3. number 数值
  4. string 字符串
  5. Void 空值 （一般用于没有任何返回值的函数）
  6. Null 和 Undefined （与Void区别是，他们是所有类型的子集）
  8. 2、其他数据类型
  9. （1）任意类型
  10. any 任意值 
  12. （2）数组类型
  13. 类型 + 方括号表示
  14. let fibonacci: number[] = [1, 1, 2, 3, 5];
  15. 数组泛型
  16. let fibonacci: Array<number> = [1, 1, 2, 3, 5];
  17. 接口表示数组
  18. interface NumberArray {
  19.     [index: number]: number;
  20. }
  21. let fibonacci: NumberArray = [1, 1, 2, 3, 5];
  23. （3）函数类型
  24. 函数声明
  25. function sum(x: number = 1, y?: number, ...items: any[]): number {  
  26.                   //x设置了参数默认值。y为可选参数，可选参数必须在必须参数后面。items为剩余参数 
  27.     return x + y;
  28. }
  29. 函数表达式
  30. let mySum: (x: number, y: number) => number = function (x: number, y: number): number {
  31.     return x + y;
  32. };
  33. 重载
  34. 重载允许一个函数接受不同数量或类型的参数时，作出不同的处理。
  35. function reverse(x: number): number;
  36. function reverse(x: string): string;
  37. function reverse(x: number | string): number | string {
  38.     if (typeof x === 'number') {
  39.         return Number(x.toString().split('').reverse().join(''));
  40.     } else if (typeof x === 'string') {
  41.         return x.split('').reverse().join('');
  42.     }
  43. }
  45. （4）内置对象
  46. let b: Boolean = new Boolean(1);
  47. let e: Error = new Error('Error occurred');
  48. let d: Date = new Date();
  49. let r: RegExp = /[a-z]/;

2、类型推论

不加类型时会发生类型推论，默认为定义时被赋值的类型,如果定义时不赋值，默认为any

3、类型联合

联合类型使用 | 分隔每个类型，如下：

  1. let myFavoriteNumber: string | number;

类型联合只能访问此联合类型的所有类型里共有的属性或方法

4、接口（interfaces）

普通使用

  1. interface Person {
  2.       readonly id: number; //只读属性，首次定义后不可改变
  3.     name: string;    //必选属性
  4.       age?: number; //可选属性
  5.       [propName: string]: string | number; //任意属性,可写0到多个，只能定义一次。 一旦定义了任意属性，必选属性和可选属性的类型都必须是它的类型的子集
  6. }
  8. let tom: Person = {
  9.       id:'8876', 
  10.     name: 'Tom',
  11.       work: 'Web',
  12.       address: 'Beijing'
  13. };
  15. tom.id = 1122 //报错,因为id为readonly

数组中的对象使用接口

  1. interface IPerson {
  2.   id?: string; // ID is optional (use of ? operator)
  3.   name: string; // Name is Required
  4.   age: number;
  5. }
  7. const persons: Array<IPerson> = [
  8.   { name: "John", age: 12 },
  9.   { name: "Ben", age: 20 }
  10. ];

5、类型断言

类型断言（Type Assertion）可以用来手动指定一个值的类型。

作用：

将一个联合类型断言为其中一个类型

将一个父类断言为更加具体的子类

将任何一个类型断言为 any

将 any 断言为一个具体的类型

值 as 类型

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

<类型>值

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

6、声明文件

当使用第三方库时，我们需要引用它的声明文件，才能获得对应的代码补全、接口提示等功能。

  1. declare var jQuery: (selector: string) => any; //定义了全局变量 `jQuery` 的类型，仅仅用于编译时的检查，在编译结果中会被删除。

7、类型别名

  1. type Name = string;

二、修饰符

  • public (默认) 修饰的属性或方法是公有的，可以在任何地方被访问到，默认所有的属性和方法都是 public 的
  • private 修饰的属性或方法是私有的，不能在声明它的类的外部访问
  • protected 修饰的属性或方法是受保护的，它和 private 类似，区别是它在子类中也是允许被访问的

三、技巧

1、忽略下一行@ts-ignore

  1. //例如 vue 中使用 getCurrentInstance
  2. import { getCurrentInstance } from 'vue'
  4. // @ts-ignore
  5. const { proxy } = getCurrentInstance();