ts中的類

TypeScript 除了實作了所有 ES6 中的類的功能以外，還添加了一些新的用法（部分ES7），

一、ES6中類的主要用法：

1、使用 class 定義類，使用 constructor 定義建構式，通過 new 生成新實體的時候，會自動呼叫建構式，

2、使用 extends 關鍵字實作繼承，子類中使用 super 關鍵字來呼叫父類的建構式和方法，

3、使用 static 修飾符修飾的方法稱為靜態方法，它們不需要實體化，而是直接通過類來呼叫，

類相當于實體的原型，所有在類中定義的方法，都會被實體繼承，如果在一個方法前，加上static關鍵字，就表示該方法不會被實體繼承，而是直接通過類來呼叫

class Person {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
  run = (): string => {
    // 實體方法
    return this.name;
  };
  static print = () => {
    console.log("Persion的靜態方法");
  };
}
var p = new Person("testName");
p.run();
Person.print();

二、實作的ES7中類的用法：

1、ES6 中實體的屬性只能通過建構式中的 this.xxx 來定義，ES7 提案中可以直接在類里面定義

2、ES6 中只有靜態方法，ES7 提案中，可以使用 static 定義靜態屬性

class Person {
  name: string;
  static title: string = "類的靜態屬性";
  constructor(name: string) {
    this.name = name;
  }
  run = (): string => {
    // 實體方法
    return this.name;
  };
  static print = () => {
    console.log("Persion的靜態方法");
  };
}
var p = new Person("testName");
p.run();
Person.print();
console.log(Person.title);

三、TypeScript自身實作的類的用法：

1、TypeScript 新增了三種訪問修飾符來修飾屬性或方法，分別是 public、private 和 protected，

• public （共有）修飾的屬性或方法是公有的，可以在任何地方被訪問到，默認所有的屬性和方法都是 public 的，在類的里邊、子類以及類的外邊都可以訪問

  class Person {
    name: string; //定義屬性  前面省略了public關鍵詞
    constructor(n: string) {
      // 建構式---實體化類的時候出發的方法
      this.name = n;
    }
    run = (): string => {
      return this.name;
    };
  }
  var p = new Person("testName");
  console.log(26, p.name); // 可訪問
  console.log(p.run()); // 可呼叫

• protected（保護） 修飾的屬性或方法是受保護的，它和 private 類似，區別是它在子類中也是允許被訪問的，在類里邊和子類中可以訪問，在類外部無法訪問

  class Person {
    protected name: string; //定義屬性  前面省略了public關鍵詞
    constructor(n: string) {
      // 建構式---實體化類的時候出發的方法
      this.name = n;
    }
    run = (): string => {
      return this.name; // 可訪問
    };
  }
  var p = new Person("testName");
  console.log(p.run()); // 可呼叫
  
  // 通過extends和super實作繼承
  class Web extends Person {
    constructor(name: string) {
      super(name);
      console.log(this.name); // 可訪問
    }
  }
  const w = new Web("test");
  // console.log(w.name) //不可訪問
  // console.log(p.name) // 不可訪問

• private （私有）修飾的屬性或方法是私有的，不能在宣告它的類的外部訪問，在類里邊可以訪問，子類和類外部無法訪問

• class Person {
    private name: string; //定義屬性  前面省略了public關鍵詞
    constructor(name: string) {
      // 建構式---實體化類的時候出發的方法
      this.name = name;
    }
    run = (): string => {
      return this.name; // 可訪問
    };
  }
  var p = new Person("testName");
  
  // 通過extends和super實作繼承
  class Web extends Person {
    constructor(name: string) {
      super(name);
      // console.log(this.name); // 可訪問
    }
  }
  const w = new Web("test");
  // console.log(w.name) //不可訪問
  // console.log(p.name) // 不可訪問

2、readonly只讀屬性關鍵字，只允許出現在屬性宣告或索引簽名中

3、abstract 用于定義抽象類和其中的抽象方法，抽象類是不允許被實體化的；抽象類中的抽象方法必須被子類實作，抽象方法只能放在抽象類中，抽象類和抽象方法用來定義標準,為子類提供一個基類

abstract class Animal {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
  abstract eat(): string;
}

class Dog extends Animal {
  eat = () => {
    return "狗糧";
  };
}

let dog = new Dog("kittle");
console.log(dog.eat());

標籤：JavaScript

上一篇：ts中介面的用法

下一篇：使用vue實作復選框單選多選