系統學習 TypeScript(四)——變數宣告的初步學習
阿新 • • 發佈:2022-02-25
認識了 TypeScript 中的基礎型別,接下來當然是變數宣告的相關學習了,我在這裡記錄一下我學習過程中的一些總結。
前言
認識了 TypeScript 中的基礎型別,接下來當然是變數宣告的相關學習了。
宣告多維陣列
假如有這麼一個宣告:
let arr3: number[][][];
想要知道 arr3 的具體型別,其分析步驟如下:
可以看到,型別拆解是從右向左的,對應到具體變數值上就是從外向內一層層拆解的。
這裡只是舉個例子,稍微有點經驗的人一眼就能判斷出 arr3 是一個三維陣列。但是,授人以魚不如授人以漁,這個分析方法卻適用於絕大多數複雜資料型別分析。
屬性重新命名
在有了 ES6 的解構賦值之後,我們可以這麼宣告變數:
let personInfo1 = { name: "程式設計三昧", age:22 } let {name: nameP, age: ageP} = personalInfo1;
以上程式碼聲明瞭 nameP 和 ageP 兩個變數。需要注意的是:變數宣告中,冒號後面跟的不是資料型別,而是新宣告來替代原物件屬性值的變數。
如果在 TypeScript 中,要指定 nameP 和 ageP 的資料型別,需要這麼寫:
let { name: nameP, age: ageP }: { name: string; age: number } = personInfo1;
其實這個型別指定可以放在物件宣告中,指定物件每一項屬性值的型別:
let personInfo1: { name: string; age: number } = { name: "程式設計三昧", age: 22 }; personInfo1.name = 12; // Error 不能將型別“number”分配給型別“string” // let {name: nameP, age: ageP} = personInfo1; let { name: nameP, age: ageP } = personInfo1; nameP = 12; // Error 不能將型別“number”分配給型別“string”
let 和 const 的暫時性死區
以下程式碼在 TypeScript 中不會報錯,但是在實際執行中會報錯。
function foo(): number {
return a1;
}
foo();
let a1: number = 12;
實際執行報錯:
我自己的理解是:靜態編譯時只負責檢測資料型別是否正確,而動態執行時才會檢測語法邏輯錯誤,恰好暫時性死區是在執行時才產生的。
總結
以上就是我在學習 TypeScript 變數宣告時所記錄的注意事項和總結。
- ~
- 本文完,感謝閱讀!
~
學習有趣的知識,結識有趣的朋友,塑造有趣的靈魂!
大家好,我是〖程式設計三昧〗的作者 隱逸王
,我的公眾號是『程式設計三昧』,歡迎關注,希望大家多多指教!