• 原文地址：Typescript : class vs interface
• 原文作者：Valentin PARSY
• 譯文出自：掘金翻譯計劃
• 本文永久連結：github.com/xitu/gold-m…
• 譯者：xueshuai
• 校對者：

Typescript : 類 vs 介面

無論是在 Java 或 Typescript 中，介面和類的定義是不同的。

我想指出一個我今天看到了很多次的錯誤。在這段 Typescript 的程式碼中我發現：

class MyClass {
  a: number;
  b: string;
}
複製程式碼

不！絕對不對。太讓人難受了。但是真正讓人難受的是接下來讀到的：

class MyOtherClass extends MyClass {
  c: number;
}
複製程式碼

哎呀呀！我知道這可能對來自一種 OOP 語言的人有一些困惑，但是在 Javascript 中，一個物件不是一個類的例項。我已經寫 C++ 快10年了，所以我理解當我們這樣做時是對的：

let mine = new MyClass();
複製程式碼

你生成了一個‘object’。但是你別忘了 Javascript 不是一個基於類的語言，他用的是原型方法（閱讀下面的文章或者其他的解釋這個的東西來掌握所有的這些是怎麼回事）。

• [關於 Javascript 原型的簡單英文指南 - Sebastian的部落格(http://sporto.github.io/blog/2013/02/22/a-plain-english-guide-to-javascript-prototypes/)

---

介面

Typescript 的一個核心原則是型別檢查，它關注的是值所擁有的_shape_。

介面就是約定。一個介面定義了一個物件裡面擁有的東西（再一次強調...不是一個類的例項）。當你定義你的介面：

interface MyInterface{
  a: number;
  b: string;
}
複製程式碼

你的意思是任何繼承了這個約定的物件一定是一個擁有這兩個（不會多，也不會少）特別的被稱為‘a’和‘b’的屬性，他們分別是數字型和字串型。當你不遵守這個約定的時候，Typescript 將會丟擲一個錯誤（例如，如果函式的引數符合 MyInterface，你不能傳遞任何別的引數）。

類

讓我們來看一看 Typescript 文件中關於類的定義的第一行：

傳統的 Javascript 使用函式和基於原型的繼承來構造可服用的元件，但是這會讓那些對物件導向方法更舒服的程式設計師感到一些尷尬，在物件導向方法中，類繼承了功能，而物件是通過類來構造的。

在 Typescript 中關於類的第一行的定義是“來自 OOP 世界的程式設計師對基於原型的繼承會感到困惑”。於是我儘可能的想“這就是 Typescript 中存在類的主要原因”（但那可能只是我這麼認為）。

Javascript 的類，在 ECMAScript 2015的介紹中，主要是 Javascript 基於原型繼承的語法糖。類的語法沒有想 Javascript 中引入一個新的物件導向的繼承模型。

你不能對 Javascript 中的類更清楚了（擴充套件一下，在 Typescript中也是一樣）

介面 vs 類

當你定義一個約定，你是想使用一個介面。一定是的，不可辯駁……但是，當你想使用一個類的時候呢？

John Papa 已經在他的文章中指出了他的定義：

• [TypeScript 的類和介面 - 第3部分(https://johnpapa.net/typescriptpost3/)

• 建立多個例項
• 使用繼承
• 單例物件

不管同意或者不同意，但正如他所說的：“類很好，但是在 Javascript 中它們不是必須的”。我想說的是，既然它們已經存在而且讓很多人的工作變得更輕鬆，那不管是什麼原因，你都可以使用它們，只要你記住，它仍然是 Javascript 和原型。

但是為什麼這麼積極地介紹這些呢？

為什麼使用類定義一個不好的約定呢？

在 Typescript 網站上有一個很棒的工具叫做“Playground”。

• Playground · TypeScript

你在左邊寫 Typescript 的程式碼，右邊就會顯示經過轉換的 Javascript 程式碼。

好吧，那是很多的 Javascript 程式碼！

現在，如果我們用介面來定義相同的約定：

什麼都沒有！因為 Typescript 只是使用介面來檢查你是否在編譯階段最瘦了約定，他不會轉換為任何 Javascript 程式碼（和類相反）。所以當我看到一個類定義了約定，我實際上在我的腦海中看到了第一張圖片，那很受傷。順便說一句，一個只有介面的檔案最終是一個空檔案。

---

掘金翻譯計劃 是一個翻譯優質網際網路技術文章的社群，文章來源為 掘金 上的英文分享文章。內容覆蓋 Android、iOS、前端、後端、區塊鏈、產品、設計、人工智慧等領域，想要檢視更多優質譯文請持續關注 掘金翻譯計劃、官方微博、知乎專欄。