Typescript的interface、class和abstract class

interface，class，和abstract class這3個概念，既有聯繫，又有區別，本文嘗試着結合官方文檔來闡述這三者之間的關係。

1. Declaration Merging

Declaration Type	Namespace	Type	Value
Namespace	X		X
Class		X	X
Enum		X	X
Interface		X
Type Alias			X
Function			X
Variable			X

首先我們來講一下上面這張表格，當我們第一列的關鍵字進行聲明時，我們在做什麼。

namespace job {
    haircut(): void;
 }
 
 class Man{
 	name: string;
 }
 let imgss = new Man();
 
 enum Color {red, blue, yellow}
 
 interface dogfood {
 
   brand: string;
   price: number
 }
 type event = 'mouse' | 'keyboard';
 
 function foo(){}
 
 let a = 2;
 var b = {};
 const c = null;

namespace用來聲明一個命名空間，比較著名的命名空間有lodash，裏面有一堆工具函數，統統放在一個叫_的namespace裏面,同時你也可以let $ = _;所以namespace也聲明了一個值。

class聲明了一個值，也聲明了一種類型，你可以把Man賦值給一個變量，所以class是一種值，也可以說imgss是一個Man(類型)，此時Man承擔了一種類型的角色。

enum聲明了一個值，也聲明了一種類型。我們說red是一種Color，Color在這裏承擔類型的角色，也可以把Color賦值給一個變量

interface聲明了一種類型，但是你不能把dogfood賦值給某個變量，否則你會得到一個報錯``dogfood' only refers to a type, but is being used as a value here`

其他function，let，var，const都在聲明一個值，你不能說xxx是一個a，或者xxx是一個foo，不能把值當成類型使用。

2. interface和class

我們知道，不算symbol，js中有6種基本類型，number，string，boolean，null, undefined, object。但是只依靠這幾種類型，來描述某個函數需要傳什麼樣的參數，是遠遠不夠的，這也是interface的使命--描述一個值（value）的形狀（type）。

現在我們來看class，class首先也具有interface的能力，描述一個形狀，或者說代表一種類型。此外class還提供了實現，也就是說可以被實例化；

所以class可以implements interface:

interface ManLike {
   speak(): void;
   leg: number;
   hand: number;
 }
 class Human implements ManLike {
   leg: number = 2;
   hand: number = 2;
   speak() {
     console.log('i can speak');
   }
 }

而interface可以extends class，此時的class承擔類型的角色

interface Chinese extends Human {
   country: string;
 }

那麼interface能不能extends enum或者type alias呢，這兩個兄弟也聲明了type啊，答案是不行的，官方報錯的信息：

An interface can only extend an object type or intersection of object types with statically known members.

3. class和abstract class

class和abstract class的區別主要是abstract class不能被實例化：

abstract Human {
 	name: string;
     abstract lang(): void;
 	toString() {
     	return `<human:${this.name}>`
     }
 }
 new Human // Cannot create an instance of an abstract class.

4. interface和abstract class

兩者都不能被實例化，但是abstract class 也可以被賦值給變量。
interface 裏面不能有方法的實現，abstract class 可以提供部分的方法實現，這些方法可以被子類調用。

參考： https://www.typescriptlang.org/docs/handbook/declaration-merging.html

本站聲明:網站內容來源於博客園,如有侵權,請聯繫我們,我們將及時處理

【其他文章推薦】

※網頁設計一頭霧水該從何著手呢? 台北網頁設計公司幫您輕鬆架站!

※網頁設計公司推薦不同的風格，搶佔消費者視覺第一線

※想知道購買電動車哪裡補助最多?台中電動車補助資訊懶人包彙整

※南投搬家公司費用,距離,噸數怎麼算?達人教你簡易估價知識!

※教你寫出一流的銷售文案?

※超省錢租車方案

Orignal From: Typescript的interface、class和abstract class

3C資訊

搜尋此網誌