一.TypeScript基礎類型

1. boolean

   const flag: boolean = false
   

2. number

   const num: number = 123
   

3. string

   const str: string = 'abc'
   

4. 數(shù)組（兩種書寫方式）

   const arr: Array<number> = [1, 2, 3, 4, 5];
   const arr: string[] = ['a', 'b', 'c'];
   

5. 元組Tuple：元組是一種特殊的數(shù)組，用于指定數(shù)組中指定位置的元素類型, 后面值必須與前面的類型一一對應

   const tup: [string, number, boolean] = ['a', 123, true];
   

6. enum枚舉：一般用于標識多種不同的狀態(tài)

   enum State {
       success,
       error = 3,
       warning
   }
   let currentState1: State = State.success
   console.log(currentState1) // 輸出：0  默認情況下，元素編號從0開始
   let currentState2: State = State.error
   console.log(currentState2) // 輸出: 3  可以手動指定元素的編號，上面指定為3
   let currentState3: State = State.warning
   console.log(currentState3) // 輸出: 4 因為前一個元素的編號被手動指定為3，所以下一個元素如果沒有指定編號，則其編號在上一個元素編號的基礎上繼續(xù)疊加
   
   // 當我們知道數(shù)值是4， 但是不確定4是哪一個狀態(tài)時，可以查找相應的名字
   let StateName: string = State[4]
   console.log(StateName) // warning
   

7. void：一般用于函數(shù)沒有返回值

   const func = (): void => {
      console.log('not return')
   }
   

8. any：可移除類型檢查

9. null/ undefined：是其他類型(never)的子類型

   const a: null = null
   const b: undefined = undefined
   

10. 其他類型 never：表示從不會出現(xiàn)的值

    let c: never = (() => {
        throw new Error('error')
    })()
    let d: never = (() => {
        while(true) {}
    })()
    

二.TypeScript函數(shù)

1. 函數(shù)定義

   1-1.函數(shù)聲明

   function getName(): string { // 在參數(shù)列表后面指定函數(shù)返回值類型
       return 'john'
   }
   

   1-2.匿名函數(shù)

   let foo = function(): number {
       return 123
   }
   

   1-3.ts中定義方法傳參

   let getUserInfo = function (name: string, age: number): string { // 指明參數(shù)的類型和函數(shù)返回值的類型
       return `姓名：${name}, 年齡：${age}`
   }
   

   1-4.ts中沒有返回值的方法

   function foo(): void {
       console.log('foo')
   }
   

2. 可選參數(shù)

   ES5里面方法的實參和形參可以不一樣，但是ts中必須一樣，如果不一樣就需要配置可選參數(shù)

   配置可選參數(shù)的方法： 在參數(shù)之后 冒好之前加上 "?"

   注意：可選參數(shù)必須配置到參數(shù)列表的最后面

   function getUserInfo(name: string, age?:number): string {
       if (age) {
           return `姓名：${name}, 年齡：${age}`
       } else {
           `姓名：${name}, 年齡: 未知`
       }
   }
   

3. 默認參數(shù)

   function getUserInfo(name: string, age: number = 20): string {
       if (age) {
           return `姓名：${name}, 年齡：${age}`
       } else {
           `姓名：${name}, 年齡: 未知`
       }
   }
   

4. 剩余參數(shù)

   // function sum(a: number, b: number, c: number, d: number): number {
   //   return a + b + c + d
   // }
   // sum(1, 2, 3, 4) // 參數(shù)傳多了會報錯\
   
   // 擴展運算符： 接收形參傳過來的值
   function sum(a: number, ...result: number[]): number {
       let sum = a;
       for(let i = 0; i < result.length; i++) {
           sum += result[i]
       }
       return sum;
   }
   

5. 函數(shù)重載

   es5中如出現(xiàn)同名方法，后面的方法會覆蓋前面的方法

   ts中的重載，同樣的方法傳入不同的參數(shù)，從而實現(xiàn)不同的功能

   function getInfo(name: string): string;
   function getInfo(age: number): number;
   function getInfo(a: any): any {
       if (typeof a === 'string') {
           return '姓名：' + a
       } else {
           return '年齡：' + a
       }
   }
   console.log(getInfo(20)); // 年齡：20
   console.log(getInfo('zhangsan')) // 姓名：zhangsan
   

三.TypeScript中的類

1. ts中類的定義

   class Person {
     name: string // 屬性 前面省略了public關鍵詞
     constructor(name: string) { // 構造函數(shù) 實例化類的時候觸發(fā)的方法
       this.name = name
     }
   
     getName(): string {
       return this.name
     }
   
     setName(name: string): void {
       this.name = name
     }
   
     run(): void {
       console.log(this.name)
     }
   }
   let p = new Person('mike')
   console.log(p.getName()) // mike
   
   p.setName('john')
   console.log(p.getName()) // john
   

2. ts中如何實現(xiàn)繼承：extends，super關鍵字

   class Person {
     name: string
     constructor(name: string) {
       this.name = name
     }
   
     run(): string {
       return `${this.name} is sporting`
     }
   }
   // 讓 Web類 繼承 Person類
   class Web extends Person {
     constructor(name: string) {
       super(name) // 初始化父類的構造函數(shù)
     }
     run() {
       return `${this.name} is sporting --- children`
     }
   }
   let w = new Web('lucy')
   console.log(w.run());
   

3. 類里面的修飾符

   typescript里面定義屬性的時候給我們提供了三種修飾符：

   public: 公有， 在當前類里面、子類里面、類外面都可以訪問

   protected： 保護類型，在當前類里面、子類里面可以訪問，在類外面無法訪問

   private： 私有，在當前類里面可以訪問、子類、類外面都無法訪問

   class Person {
     public name: string    // 公有屬性 public
     // protected name: string // 保護屬性 protected
     // private name: string      // 私有屬性 private
     constructor(name: string) {
       this.name = name
     }
     run(): string {
       return `${this.name} is sporting`        // 當前類里面
     }
   }
   
   class Web extends Person {
     constructor(name: string) {
       super(name)
     }
     sleep(): string {
       return `${this.name} is sleepping`   // 子類里面
     }
   }
   
   let p = new Person('hhh')                   // 類外部
   console.log(p2.name); // 輸出： hhh
   

4. 靜態(tài)屬性，靜態(tài)方法

   靜態(tài)屬性：直接通過類來調用

   實例屬性：需要先實例化對象，再通過實例化對象來調用

   class Person {
     public name: string
     public age: number
     static sex = '男'
     constructor(name: string, age: number) {
       this.name = name
       this.age = age
     }
   
     run() { // 實例方法
       console.log(`${this.name} is runing`)
     }
   
     static print() { // 靜態(tài)方法 靜態(tài)方法里面沒法直接調用類里面的屬性，只能訪問靜態(tài)屬性
       console.log('靜態(tài)方法里面訪問靜態(tài)屬性：' + this.age) // 報錯
       console.log('靜態(tài)方法里面訪問靜態(tài)屬性：' + this.sex) // 靜態(tài)方法里面訪問靜態(tài)屬性： 男
     }
   }
   
   Person.print()
   
   console.log(Person.sex)  // 男
   

5. 多態(tài)

   父類定義一個方法不去實現(xiàn)，讓繼承它的子類去實現(xiàn)，每一個子類有不同的表現(xiàn)

   多態(tài)也是繼承的一種表現(xiàn)

   class Animal {
     public name: string
     constructor(name: string) {
       this.name = name
     }
     eat() {
       console.log('eat funciton')
     }
   }
   
   class Dog extends Animal {
     constructor(name: string) {
       super(name)
     } 
   
     eat() {
       return this.name + 'eat meat'
     }
   }
   
   class Cat extends Animal {
     constructor(name: string) {
       super(name)
     }
     
     eat() {
       return this.name + 'eat fish'
     }
   }
   

6. 抽象方法

   ts中的抽象類，它是提供其他類繼承的基類，不能直接被實例化

   用abstract關鍵字定義抽象類和抽象方法，抽象類中的抽象方法不包含具體實現(xiàn)并且必須在派生類中實現(xiàn)

   abstract抽象方法只能放在抽象類里面

   // 抽象類和抽象方法來定義標準， 標準：Animal這個類要求它的子類必須包含eat方法
   abstract class Animal { // 無法創(chuàng)建抽象類的實例
     public name: string
     constructor(name: string) {
       this.name = name
     }
     abstract eat(): any // 抽象方法在子類中必須實現(xiàn)（抽象類中的抽象方法不包含具體實現(xiàn)并且必須在派生類（子類）中實現(xiàn)）
   }
   
   class Dog extends Animal {
     constructor(name: any) {
       super(name)
     }
   
     // 抽象類的子類必須實現(xiàn)抽象類里面的抽象方法
     eat() {
       console.log(this.name + ' eat meat')
     }
   }
   
   class Cat extends Animal {
     constructor(name: any) {
       super(name)
     }
   
     eat() {
       console.log(this.name + ' eat fish')
     }
   }
   let d = new Dog('dog')
   d.eat() // dog eat meat
   let c = new Cat('cat')
   c.eat() // cat eat fish
   

持續(xù)更新。。。