1. 程式人生 > 其它 >es6 Class類的理解

es6 Class類的理解

------------恢復內容開始------------

概念:

class類是es6的一種建構函式語法糖寫法。

建立一個class類

class myClass{
//構造器,預設為空的構造器 //當class在被new時就會呼叫構造器 //相當於function //function myClass(name,age){ // this.name=name // this.age=age //}
  //

  //name : string; //類的屬性
  //age:string
  constructor(name,age){ //這些都是例項屬性 //只有例項才能訪問
this.name=name this.age=age } }
  //類的方法
  greeting() {};
//定義於 constructor 內的屬性和方法,即定義在 this 上,屬於例項屬性和方法,否則屬於原型屬性和方法。在TypeScript中,是不允許直接在constructor中定義變數的,需要在constructor上面先宣告。
  使用 class 定義類,使用 constructor 定義建構函式。
通過 new 生成新例項的時候,會自動呼叫建構函式。
 

建立類例項物件

var i=new myClass('小明'18)
類的繼承

使用 extends 關鍵字實現繼承,子類中使用 super 關鍵字來呼叫父類的建構函式和方法(super需要同步父類的引數個數?)

//動物類
 class  AnimalClass {
 private  name : string;
 public constructor(theName:string){
    this.name = theName;
};
 public  move(movedistance : number = 0){
 console.log(`${this.name} 移動的距離是 ${movedistance}`);
};
 }
 //蛇繼承了動物類
 class Shake extends AnimalClass{
   constructor(name : string){
        super(name);   
//初始化父類
      // 如果在子類中寫了建構函式,相當於重寫了父類的建構函式。 // 在子類建構函式中必須對父類的建構函式進行呼叫, // 否則父類的建構函式不會執行
}; move(movedistance:number =5){ console.log("Shake..."); super.move(movedistance); } } //馬繼承了動物類 class House extends AnimalClass{ constructor(name : string){ super(name); }; move(movedistance:number =10){ console.log("House..."); super.move(movedistance);
// 在類的方法中super就表示呼叫當前類的父類方法 } } let shake
= new Shake(""); let house : AnimalClass = new House(""); shake.move(); // 多型 house.move(50); // 多型



修飾符

typeScript 可以使用三種訪問修飾符(Access Modifiers),分別是 public、private 和 protected。

public 修飾的屬性或方法是公有的,可以在任何地方被訪問到,預設所有的屬性和方法都是 public 的
private 修飾的屬性或方法是私有的,不能在宣告它的類的外部訪問

protected 修飾的屬性或方法是受保護的,它和 private 類似,區別是它在子類中也是允許被訪問的

 class  AnimalClass {
//只有當前類可以訪問
private  _animalName : string;
public constructor(theName:string){
    this._animalName = theName;
};
//子類可以訪問
protected  move(movedistance : number = 0){
 console.log(`${this._animalName} 移動的距離是 ${movedistance}`);
};
private jump(distance : number = 0){
    console.log(`${this._animalName} jummp ${distance}`);
}
 // getter setter存取器
set animalName(aName : string){
     this._animalName = aName;
}
get  animalName(){
    return this._animalName;
}
}

靜態方法、靜態屬性

使用 static 修飾符修飾的方法稱為靜態方法,它們不需要例項化,而是直接通過類來呼叫

 
  class Animal {
   //靜態屬性
  static num = 42;  
   //靜態方法
  static isAnimal(a) {
    return a instanceof Animal;
  }
}
let a = new Animal('Jack');
Animal.isAnimal(a); // true
a.isAnimal(a); // TypeError: a.isAnimal is not a function
console.log(Animal.num); // 42
 例項方法和屬性

ES6 中例項的屬性只能通過建構函式中的 this.xxx 來定義,ES7 提案中可以直接在類裡面定義

class Animal {
//例項屬性
name = 'zibin';
constructor() {
    // ...
}
}
 //例項方法
run() {};
let a = new Animal();
console.log(a.name); // zibin

類的型別

類可以作為資料型別的,如上圖所示,我們將Person作為p1的型別,此時p1必須完全按照Person的型別來進行約束。

------------恢復內容結束------------