typescript進階（二）：interface 和 class 的區別

Typescript 中 interface 和 class 的區別？

interface: 接口只負責聲明成員變量類型，不作具體實現。

class：類既聲明成員變量類型並實現。

interface是什麼?

在OOP語言中，接口（Interfaces）是一個很重要的概念，它是對行爲的抽象，而具體如何行動須要由類（classes）去實現（implement）。

TypeScript 中的接口是一個很是靈活的概念，除了可用於對類的一部分行爲進行抽象之外，也經常使用於對「對象的形狀（Shape）」進行描述。

例如：

interface Person {
 name: string;
 age: number;
}
複製代碼

上述例子就是一個最簡單的接口，分別有兩個屬性分別叫作name和age，對應的值是一個字符串和一個數字。利用接口約束了傳入變量的內容，當你不遵照這個約定時，typescript就會拋出一個錯誤。

Class是什麼?

傳統方法中，JavaScript 經過構造函數實現類的概念，經過原型鏈實現繼承。而在 ES6 中，咱們終於迎來了 class。TypeScript 除了實現了全部 ES6 中的類的功能之外，還添加了一些新的用法。（今天只講述類與interface卻別，具體類的其餘特性可參考官方）

//類Person
class Person {
 name: string;
 age: number;
 constructor(name: string, age: number) {
  this.name = name;
	this.age = age;
 }
};

//類充當接口使用,接口中只包含其中的實例屬性和實例方法（constructor和static不在其中）
const person: Person = {
 name: '張三',
 age: 18
};

//接口繼承類
interface Person1 extends Person{
 sex: string,
 printName() : void
};

const person1: Person1 = {
 name: '張三',
 age: 18,
 sex: '男',
 printName() {
    console.log(this.name) 
 }
};

//類實現接口
class Person2 implements Person1 {
  name: string;
  age: number;
  sex: string;
  email: string;
  printName() {
    console.log(this.name)
  };
}
複製代碼

總結

Typescript中聲明class，實際上，除了會建立一個類以外，同時也會建立一個同名的interface（同名的interface只包含其中的實例屬性和實例方法）。因此class既能夠看成類來使用，也能夠看成interface來使用。

我的博客地址，有興趣的能夠看一看