前端 TS

类型：

用法

• number

  let decimal: number = 6;
  let hex: number = 0xf00d;
  let big: bigint = 100n;
  

• boolean

  let isDone: boolean = false;
  

• string

  let color: string = "blue";
  color = 'red';
  

• 字面量

• 也可以使用字面量去指定变量的类型，通过字面量可以确定变量的取值范围

  let color: 'red' | 'blue' | 'black';
  let num: 1 | 2 | 3 | 4 | 5;
  

• any

  let d: any = 4;
  d = 'hello';
  d = true;
  

• unknown

  let notSure: unknown = 4;
  notSure = 'hello';
  

• void

  let unusable: void = undefined;
  function fn(): void{}
  function fn(): void { return undefined
  }
  

• never

  function error(message: string): never { throw new Error(message);
  }
  

• object（没啥用）

  let obj: object = {};
  

• array

  let list: number[] = [1, 2, 3];
  let list: Array = [1, 2, 3];
  

• tuple

  let x: [string, number];
  x = ["hello", 10]; 

• enum

  enum Color { Red,   // 0
     Green, // 1
     Blue,  // 2
  }
  let c: Color = Color.Green;
  enum Color { Red = 1,  // 1
     Green,    // 2
     Blue,     // 3
  }
  let c: Color = Color.Green;
  enum Color { Red = 1,    // 1
     Green = 2,  // 2
     Blue = 4,   // 4
  }
  let c: Color = Color.Green;
  

• 断言

   //写法1
        let someValue: unknown = "this is a string";
        let strLength: number = (someValue as string).length;
        //写法2
        let someValue: unknown = "this is a string";
        let strLength: number = (someValue).length;
        ```
  

• 接口

  • 接口的作用类似于没有实际值的抽象类
  • 可以用于定义对象，方法的参数/返回值，接口（使用extends关键字），类（使用implements关键字）的结构

    //对象
    interface Info { name: string
       age: number
       say?: () => void
    }
    const user: Info = { name: '张三',
       age: 18,
       say: () => { console.log(`我叫${this.name}`)
       }
    }
    //方法的参数和返回值
    interface sum { (a: number, b: number): number
    }
    const add: sum = (a, b) => { return a + b;
    }
    sum(1, 2)
    // 接口
    interface Person{ name: string;
       say():void;
    }
    interface man extends Person{ eat():void;
    }
    // 类
    interface Person{ name: string;
       say():void;
    }
    interface Student{ hello():void;
    }
    // 同时执行多个接口，用`,`隔开
    class Student implements Person,Student{ constructor(public name: string) {}
       say() { console.log(`我叫${this.name}`);
       }
       hello() { console.log(`我是一个学生`);
       }
    }
    

  • Class （链接: link）

  • 泛型（链接：link）