Typescript學習筆記（三）變量聲明及做用域

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