Typescript 中的類

1. ts 中類的定義

  es5：

function Person(name) {
    this.name = name;
    this.run = function() {
        console.log(this.name)
    }
}
var p = new Person('張三')
p.run()      

1.1  ts 中類的定義

class Person {
    name:string; // 屬性 前面省略了public 關鍵詞
    constructor(n:string) {
        this.name = n;
    }
    getName():string {
        alert(this.name)
        return this.name;
    }
    setName(name:string):void {
        this.name = name;
    }
}
var p = new Person('趙四')
p.getName()
p.setName('王麻子')
p.getName()      

1.2  ts 中類的繼承

class Person {
    name:string;
    constructor(name:string) {
        this.name = name;
    }
    run():string {
        return `${this.name}在運動`
    }
}
class Women extends Person {
    constructor(name:string) {
        super(name);
    }
    run():string {
        return `${this.name}在運動 - 子類`
    }
    work():string {
        return `${this.name}在工作`
    }
}
var p = new Women('李斯')
alert(p.run())
alert(p.work())      

1.3  類的修飾符

類裡面的修飾符 typescript 裡面定義屬性時提供了 三種修飾符：

 public:        公有    在類裡面、子類、類外面都可以通路

 protected:  保護類型   在類裡面、子類裡面可以通路，在類外面無法通路

 private:       私有    在類裡面可以通路，子類、類外面都無法通路

 注：不加修飾符，預設是 public

// 類外部通路公有屬性
 class Person {
     public name:string;
     constructor(name:string) {
        this.name = name;
     }
     run():string {
         return `${this.name}在運動`
     }
 }
 var p = new Person('哈哈哈');
 alert(p.name)      

class Person {
    protected name:string;
    constructor(name:string) {
        this.name = name;
    }
    run():string {
        return `${this.name}在運動`
    }
}
class Web extends Person {
    constructor(name:string) {
        super(name);
    }
    work() {
        alert(`${this.name}在工作`)
    }
}
var w = new Web('許三多')
w.work()

      

  var p = new Person('張三')

  p.name // 無法通路

 1.4 靜态屬性   靜态方法

  class Person {

    public name:string

    static age:number = 20;

    constructor(name:string) {

        this.name = name;

    }

    run() { // 執行個體方法

        alert(`${this.name}在跑步`)

    work() {

        alert(`${this.name}在搬磚`)

    static print() { // 靜态方法  沒法直接調用類裡面的屬性

        alert(`${this.name}在列印`)  // 錯誤使用，類型“typeof Person”上不存在屬性“name”。

        alert(`${Person.age}在列印`) // 正确使用

  }

  var p = new Person('許三多');

  Person.print();

1.5 多态

定義：  父類定義一個方法不實作，讓繼承它的子類去實作，每一個子類有不同的表現。

class Animal {
    name:string;
    constructor(name:string) {
        this.name = name;
    }
    eat() {
        console.log('吃東西')
    }
}
class Dog extends Animal {
    constructor(name:string) {
        super(name);
    }
    eat() {
        console.log(this.name + '吃狗糧')
    }
}
class Cat extends Animal {
    constructor(name:string) {
        super(name);
    }
    eat() {
        console.log(this.name + '吃貓糧')
    }
}
var dog = new Dog('小狗')
dog.eat()
var cat = new Cat('小貓')
cat.eat()      

// ts 中的抽象類，它是提供其他類繼承的基類，不能直接被執行個體化。
// 用 abstract 關鍵字定義抽象類和抽象方法，抽象類中的抽象方法不包含具體實作并且必須在派生類中實作。
// abstract 抽象方法隻能放在抽象類裡面
// 抽象類和抽象方法用來定義标準。标準：Animal 要求它的子類必須包含 eat 方法      

  abstract class Animal {

    name:string;

    abstract eat():any;

  // 抽象類的子類必須實作抽象類的抽象方法，其他方法可以不實作

  class Dog extends Animal {

        super(name);

    eat() {

        alert(this.name + '吃狗糧')

  let dog = new Dog('薩摩耶')

  dog.eat()