最近本文作者在用typescript開發代碼時發現接口interface和類型別名type用法很像,這篇文章我們就來聊聊這兩個用法的異同點。
異同點
![詳解typescript中接口interface和類型別名type的用法區別](http://p2.ttnews.xyz/loading.gif)
圖1
從圖1中我們發現接口interface和類型別名type在定義一個普通的對象類型時沒啥區別,泛型都能照常用。
如果我們定義一個簡單類型呢?
![詳解typescript中接口interface和類型別名type的用法區別](http://p2.ttnews.xyz/loading.gif)
圖2
如圖2所示,像這樣的簡單類型的定義,type用起來就很隨意,但是interface恐怕就無法做到了。
圖3
如圖3,它們兩都可以輕鬆實現一個函數的類型,寫法稍微有點區別,但是它們都能被類class實現嗎?
圖4
如圖4所示,接口interface可以被一個類class實現(implements),但是類型別名是不行的。
圖5
類型別名type不但不能被extends和implements,就連自己也不能extends和implements其它類型,好在我們可以用交叉類型代替extends來達到同樣的效果。
說到這裡,你就會發現type可以使用聯合類型、交叉類型還有元組等類型,如下圖。
圖6
個人認為類型別名type最大的特點是可以結合typeof使用,如下:
圖7
總結
這篇文章主要總結了typescript中類型別名type和接口interface在使用上的一些區別,在類class的類型定義中我們使用接口interface來做,在定義簡單類型、聯合類型、交叉類型、元組時我們用類型別名type來做,並且它和typeof能夠天然的結合在一起使用。在雙方都能實現的區域,它們的區別不大。
喜歡我的文章就關注我吧,有問題可以發表評論,我們一起學習,共同成長!
閱讀更多 做前端的蝸牛 的文章
關鍵字: 接口 TypeScript 文章