網(wǎng)站首頁 編程語言 正文
接口
使用 interface 關(guān)鍵字來定義數(shù)據(jù)類型
對象類型
當存在于較長的數(shù)據(jù)類型約束時,我們可以通過 type 關(guān)鍵字 為類型注解起別名,也可以通過接口來定義
type UserType = { name: string; age?: number }; const user: UserType = { name: "kiki", age: 18, }; interface IUserType { name: string; age?: number } const person: IUserType = { name: 'alice', age: 20 }
索引類型
interface 和type定義對象都可以為只知道key的類型,不知道具體 key 值的時候,進行類型的定義
interface ILanguage { [index: number]: string; } const language: ILanguage = { 0: "html", 1: "css", 2: "js", }; type Score = { [name: string]: number; } const score: Score = { Chinese: 120, math: 95, Englist: 88, };
函數(shù)類型
定義函數(shù)時,interface 和 type 的語法稍有不同
interface ISelfType { (arg: string): string; } type LogType = (arg: string) => string; function print(arg: string, fn: ISelfType, logFn: LogType) { fn(arg); logFn(arg); } function self(arg: string) { return arg; } console.log(print("hello", self, self));
繼承
接口可以實現(xiàn)多繼承,繼承后的接口具備所有父類的類型注解
interface ISwim { swimming: () => void; } interface IEat { eating: () => void; } interface IBird extends ISwim, IEat {} const bird: IBird = { swimming() {}, eating() {}, };
交叉類型
交叉類型其實是與的操作,用 & 符號,將接口進行與操作后,實質(zhì)上需要滿足所有與操作接口的類型注解
interface ISwim { swimming: () => void; } interface IEat { eating: () => void; } type Fish = ISwim | IEat; type Bird = ISwim & IEat; const fish: Fish = { swimming() {}, }; const bird: Bird = { swimming() {}, eating() {}, }; export {}
接口實現(xiàn)
接口可以通過類使用 implements 關(guān)鍵字來實現(xiàn),類只能繼承一個父類,但是可以實現(xiàn)多個接口
interface ISwim { swimming: () => void } interface IEat { eating: () => void } class Animal {} class Fish extends Animal implements ISwim, IEat { swimming(){} eating(){} } class Person implements ISwim { swimming(){} } function swimAction(iswim: ISwim){ iswim.swimming() } swimAction(new Fish()) swimAction(new Person())
沒有實現(xiàn)接口的類,自然是沒有該接口中的方法
interface 和 type 的區(qū)別
很多時候 interface 和 type 是相同的,但有一個明顯區(qū)別在于 interface 可以重復(fù)定義,類型注解會累加,而 type 重復(fù)定義會報錯
字面量賦值
直接把字面量賦值類型給變量時,會對字面量進行類型推導(dǎo),多出的屬性會報錯
但是將對象的引用賦值的話,會進行 freshness 擦除操作,類型檢測時將多余的屬性擦除,如果依然滿足類型就可以賦值
枚舉類型
枚舉類型通過 enum 關(guān)鍵字來定義,它和聯(lián)合類型實現(xiàn)的功能類似,但是枚舉類型的代碼閱讀性會更強一些
enum Direction { LEFT, RIGHT, TOP, BOTTOM, } function turnDirection(direction: Direction) { switch (direction) { case Direction.LEFT: break; case Direction.RIGHT: break; case Direction.TOP: break; case Direction.BOTTOM: break; default: const foo: never = direction; break; } } turnDirection(Direction.LEFT);
泛型
泛型函數(shù)
當不確定入?yún)⒌念愋蜁r,可以定義類型注解為泛型,使用的時候再指定具體類型,使用 <> 來進行泛型的定義。
function self(element: T) { return element; } self ("alice"); self (2); self (null);
如果沒有定義類型,ts會進行類型推導(dǎo),有可能并不是我們希望的類型,如以下字符串推導(dǎo)出來不是”string“字符串類型,而是“hello”字面量類型。
當存在多個參數(shù)時,在泛型中定義多個即可
function foo(a: T, b: E, c: O){} foo(1, 'alice', false) foo(['alice'], undefined, null)
泛型接口
在接口中使用泛型,將類型注解寫在接口名后
interface Person{ name: T; age: E; } const person: Person = { name: "alice", age: 20, };
在接口中使用泛型是無法進行類型推導(dǎo)的,使用的時候必須指定具體的類型
除非在接口定義的時候給泛型設(shè)置了默認值
interface Book{ category: T; price: E; } const book: Book = { category: "nature", price: 88.6, }; const dictionary: Book = { category: 1, price: '88' }
泛型類
類中定義的方式,只是將具體的數(shù)據(jù)類型替換成了泛型,在類中是可以進行類型推導(dǎo)的
class Point{ x: T; y: T; z: T; constructor(x: T, y: T, z: T) { this.x = x; this.y = y; this.z = z; } } new Point("1.55", "2.34", "3.67"); new Point(1.55, 2.34, 3.67);
類型約束
泛型可以通過繼承來進行類型約束
只需要傳入的參數(shù)滿足泛型的條件,即有 length 屬性
interface ILength { length: number; } function getLength(element: T) { return element.length; } getLength("alice"); getLength(["alice", "kiki", "lucy"]); getLength({ length: 5 });
接口、枚舉、泛型 這些類型在JavaScript都是沒有的,但在TypeScirpt中都是非常重要的類型注解。
總結(jié)
原文鏈接:https://blog.csdn.net/bingbing1128/article/details/123466372
相關(guān)推薦
- 2024-02-26 Yaml數(shù)據(jù)讀取
- 2022-06-29 C語言超詳細講解getchar函數(shù)的使用_C 語言
- 2022-03-24 Android繪制旋轉(zhuǎn)動畫方法詳解_Android
- 2023-10-14 【c++】四舍五入
- 2022-05-10 錯誤解決 刪除同名Maven Module,重新建立顯示ignored pom.xml問題
- 2022-08-10 讀取Go項目中的配置文件的方法_Golang
- 2021-12-06 Android優(yōu)化提升應(yīng)用啟動速度及Splash頁面的設(shè)計_Android
- 2022-06-20 正則表達式之字符串模式匹配實例詳解_正則表達式
- 最近更新
-
- window11 系統(tǒng)安裝 yarn
- 超詳細win安裝深度學習環(huán)境2025年最新版(
- Linux 中運行的top命令 怎么退出?
- MySQL 中decimal 的用法? 存儲小
- get 、set 、toString 方法的使
- @Resource和 @Autowired注解
- Java基礎(chǔ)操作-- 運算符,流程控制 Flo
- 1. Int 和Integer 的區(qū)別,Jav
- spring @retryable不生效的一種
- Spring Security之認證信息的處理
- Spring Security之認證過濾器
- Spring Security概述快速入門
- Spring Security之配置體系
- 【SpringBoot】SpringCache
- Spring Security之基于方法配置權(quán)
- redisson分布式鎖中waittime的設(shè)
- maven:解決release錯誤:Artif
- restTemplate使用總結(jié)
- Spring Security之安全異常處理
- MybatisPlus優(yōu)雅實現(xiàn)加密?
- Spring ioc容器與Bean的生命周期。
- 【探索SpringCloud】服務(wù)發(fā)現(xiàn)-Nac
- Spring Security之基于HttpR
- Redis 底層數(shù)據(jù)結(jié)構(gòu)-簡單動態(tài)字符串(SD
- arthas操作spring被代理目標對象命令
- Spring中的單例模式應(yīng)用詳解
- 聊聊消息隊列,發(fā)送消息的4種方式
- bootspring第三方資源配置管理
- GIT同步修改后的遠程分支