Typescript學習筆記(三)變數宣告及作用域
阿新 • • 發佈:2019-01-10
ts的變數宣告有var,let和const,這尼瑪完全跟es6一樣嘛。就稍微介紹一下。
大多數js開發者對於var很熟悉了,原生js裡沒有塊級作用域,只有函式作用域和全域性作用域,還存在var的變數提升的問題,導致一些不熟悉js的開發者會發現一些怪異事件。點選檢視關於es6的let與const
let宣告
let宣告和var一樣的寫法,大家看前面的部落格裡面相信也看到了。
揀重要的說,let和var的區別就是let使js實現了它的塊級作用域,即詞法作用域或塊作用域。
而且它不存在變數提升。
function f(input: boolean) { let a = 100; if (input) { // Still okay to reference 'a' let b = a + 1; return b; } // Error: 'b' doesn't exist here return b; }
內部塊一樣能訪問外部塊,反之就不行了。這一特性使for迴圈的計數器就比較好用了,
for(let i = 0; i < arr.length; i++){} console.log(i) //ReferenceError: i is not defined
// 報錯 function () { let a = 10; var a = 1; } // 報錯 function () { let a = 10; let a = 1; }
let是不允許重複宣告的。
需要注意的是,現在的ts編譯器都是吧let直接編譯為var,所以let的特性在瀏覽器支援之前還是無法試用的。
在js裡面輸出10個10的例子,在let下就不一樣了。
for (let i = 0; i < 10 ; i++) { setTimeout(function() {console.log(i); }, 100 * i); }
不僅是在迴圈裡引入了一個新的變數環境,而是針對每次迭代都會建立這樣一個新作用域。 這就是我們在使用立即執行的函式表示式時做的事。
他會和我們預想的一樣輸出1-10。
const
const和let基本一致,只是const宣告的變數被賦值後不能再改變(所以對於const來說,只宣告不賦值,就會報錯),作用域同let。
const numLivesForCat = 9; const kitty = { name: "Aurora", numLives: numLivesForCat, } // Error kitty = { name: "Danielle", numLives: numLivesForCat }; // all "okay" kitty.name = "Rory"; kitty.name = "Kitty"; kitty.name = "Cat"; kitty.numLives--;
const a = []; a.push("Hello"); // 可執行 a.length = 0; // 可執行 a = ["Dave"]; // 報錯
這個陣列和物件本身是可寫的,但是如果將另一個數組賦值給const變數,就會報錯。
使用的法則:
所有變數除了你計劃去修改的都應該使用const