type 和 interface 的區别?在typescript裡面，有兩個概念十分容易混淆，那便是 type 和 interface，它倆都可以用來表示 接口，但是實際使用上會存在一些差異，因此本篇文章就準備聊聊它倆，徹底弄清它倆的聯系與區别，廢話不多說，開搞，下面我們就來說一說關于type 和 interface 的區别?我們一起去了解并探讨一下這個問題吧!

type 和 interface 的區别

在typescript裡面，有兩個概念十分容易混淆，那便是 type 和 interface，它倆都可以用來表示 接口，但是實際使用上會存在一些差異，因此本篇文章就準備聊聊它倆，徹底弄清它倆的聯系與區别，廢話不多說，開搞！

在我看來，它倆就是對 接口定義 的兩種不同形式，目的都是一樣的，都是用來定義 對象 或者 函數 的形狀，示例如下

interface example { name: string age: number } interface exampleFunc { (name:string,age:number): void } type example = { name: string age: number } type example = (name:string,age:number) => void 複制代碼

它倆也支持 繼承，并且不是獨立的，而是可以 互相 繼承，隻是具體的形式稍有差别

type exampleType1 = { name: string } interface exampleInterface1 { name: string } type exampleType2 = exampleType1 & { age: number } type exampleType2 = exampleInterface1 & { age: number } interface exampleInterface2 extends exampleType1 { age: number } interface exampleInterface2 extends exampleInterface1 { age: number } 複制代碼

可以看到對于interface來說，繼承是通過 extends 實現的，而type的話是通過 & 來實現的，也可以叫做 交叉類型

首先聊聊type可以做到，但interface不能做到的事情

1. type可以定義 基本類型的别名，如 type myString = string
2. type可以通過 typeof 操作符來定義，如 type myType = typeof someObj
3. type可以申明 聯合類型，如 type unionType = myType1 | myType2
4. type可以申明 元組類型，如 type yuanzu = [myType1, myType2]

接下來聊聊interface可以做到，但是type不可以做到的事情

1. interface可以 聲明合并，示例如下

interface test { name: string } interface test { age: number } /* test實際為 { name: string age: number } */ 複制代碼

這種情況下，如果是type的話，就會報 重複定義 的警告，因此是無法實現 聲明合并 的

這裡特别感謝 酒薄不堪飲[1] 這位掘友，指出了此處之前存在的錯誤說法

結語

其實在typescript裡，還有很多容易搞混淆的概念，如 extends 和 implements 等，還有一些高級概念，如 泛型。這些都是在ts裡必知必會的東西，因此一定要細摳這些知識點

ts給我們的代碼帶來健壯性的同時，也引入了更多的概念和知識，因此需要我們不斷地學習。在今後我也準備多輸出一些關于ts的文章，加深自己對于ts的理解，同時也可以幫助到喜歡看我文章的朋友，好啦，就寫到這裡啦，over！

,

更多精彩资讯请关注tft每日頭條，我们将持续为您更新最新资讯!

查看全部