changed 2 years ago  
Published Linked with GitHub

【Typescript】類別

物件導向 (Object Oriented)

  • Java
  • Python
  • JS也有，但沒有那麼嚴謹

所有東西都是物品





















class Caculator {
  private name: string;

  constructor(name: string) {
    this.name = name;
  }

  public add(a: number, b: number): number {
      return a + b;
  }
  public sub(a: number, b: number): number {
      return a - b;
  }
  public mul(a: number, b: number): number {
      return a * b;
  }
  public div(a: number, b: number): number {
      return a / b;
  }    
}

所有東西都是物品









import Caculator from './Caculator';

const caculator = new Caculator('example');

console.log(caculator.add(1, 2));
console.log(caculator.sub(1, 2));
console.log(caculator.mul(1, 2));
console.log(caculator.div(1, 2));
  • 類別: 只會有一個
class ....
  • 物件: 可以有很多個


const caculator = new Caculator('example');
const caculator2 = new Caculator('mycaculator');

建構子




constructor(name: string) {
    this.name = name;
}

this

要使用class內部的方法、取得class內部的變數要使用this

OOP的三大特性

  • 封裝
  • 繼承
  • 多形

封裝

不用知道別人的class怎麼寫的就可以直接使用

繼承

可以繼承別的class的內容，並新增自己需要的功能上去







class ScientificCaculator extends Caculator {
    constructor(name: string) {
        super(name);
    }
    ...
}

多形

同一個方法在不同子類別裡面，可以有不同的實作方法

getter & setter

用以改變屬性的讀取和賦值行為


















class Caculator {
  private name: string;

  constructor(name: string) {
    this.name = name;
  }

  ...

  get Name(): string {
    return this.name;
  }

  set Name(name: string) {
    this.name = name;
  }
}

修飾符

  • public
    • 任何人都可以存取，預設值
  • protected
    • 只有同一個家族的可以存取
  • private
    • 只有自己可以存取
  • readonly
    • 只能讀不能寫，可以和其他的一起寫

抽象 Abstract

  • 抽象的方法
  • 抽象的類別

抽象的方法





















class Caculator {
  private name: string;

  constructor(name: string) {
    this.name = name;
  }

  public abstract add(a: number, b: number): number {
      return a + b;
  }
  public abstract sub(a: number, b: number): number {
      return a - b;
  }
  public abstract mul(a: number, b: number): number {
      return a * b;
  }
  public abstract div(a: number, b: number): number {
      return a / b;
  }    
}

Caculator.add(1 + 2)

抽象的類別

  • 抽象類別不能被實例化
  • 子類別要自己寫抽象方法












absract class Caculator {
  private name: string;

  constructor(name: string) {
    this.name = name;
  }

  public abstract add(a: number, b: number);
  public abstract sub(a: number, b: number);
  public abstract mul(a: number, b: number);
  public abstract div(a: number, b: number);
}

一些參考資料

TSHandbook 中文版
ES6入門-Classes

Select a repo