Javascript 进阶 8-1 Let, Const 基本概念-58码农网

这个章节，主要来介绍 ES6 中宣告变数的语法糖，Let 以及 Const。

ES6主要是为了改善以及加快开发速度所产生的语法，也可以避免掉传统ES5一些语法所造成的问题。

那么我们就来看看 Let 以及 Const 要怎么使用吧!

在介绍 Let 以及 Const，我们先来看看 var 宣告变数的时候会有甚么状况~

var a = '1';过了好几千行，或是别的开发者不知道前面有宣告过变数 avar a = 1;

这样执行是没有问题，但结果就会让后面的 a 覆盖掉前面的 a，造成一些非预期的错误。

for (var i = 0; i < 10; i++) {    console.log(i);}

如果我们这样宣告 i ，并且执行了这个 for 迴圈，预期会产生的结果就是印出 0 ~ 9。

但是因为我们是用 var 进行宣告，所以除了在for迴圈可以取得到这个i的变数之外，在迴圈之外的作用域也可以取用的到i。

这就变成我们常提到的全域变数的汙染。

var answer = true;        if (answer) {    var feedBack = '5555';    console.log(feedBack);}console.log(feedBack); // 取得到 feedBack 的值

那为了避免这些汙染，传统的做法就是使用立即函式将这些执行的内容包起来:

(function () {    for (var j = 0; j < 10; j++) {        console.log(j);    }})();console.log(j);

Let 以及 Const

首先先来说明一下 Let 以及 Const 两者的差异:

=> Let 宣告后的变数，可以重新赋值修改，但 Const 不行。

let odin = 'husky';odin = 'dog';

const odin = 'husky';odin = 'dog';

另外，刚刚提到如果先用 var 宣告过一次变数，再用 var 宣告另一次相同名称的变数，是没有问题的，但用在 let 或 const上，就会有问题:

var 的作用域是函式的作用域

let 的作用域是Block({})的作用域

也就是说如果使用 let、const 在 Block 的範围内做宣告，在外层是没有办法取用到该变数的喔!

{    let odin = 'dog';    console.log('Block', odin);}console.log('非Block', odin);

并且如果这时候在外层还有重複变数名称的变数宣告，这样他们就不算是同一个变数，也不会报错!

{    let odin = 'dog';    console.log('Block', odin);}let odin = '123';console.log('非Block', odin);

那再来看看刚刚 for 迴圈改成 let 设定变数:

for (let i = 0; i < 10; i++) {    console.log(i);}console.log(i);

由于 i 是在 for 迴圈的 Block 中才能被取用到，所以当然在 for 迴圈之外的作用域是取不到 i 的值。

刚刚的 feedback 宣告也是相同的概念，把 feedback 宣告改成 let ，这时候外层作用域就取不到 feedback 的内容了!

var answer = true;        if (answer) {    let feedBack = '5555';    console.log(feedBack);}console.log(feedBack); // 取不得到 feedBack 的值

最后是立即函式和 for 迴圈的搭配:

for (let j = 0; j < 10; j++) {    console.log(j);}console.log(j);

因为使用 let ，所以我们也不需要用立即函式包覆起来，let宣告的变数自身的特性就不会污染其他作用域。

真的要限制的话，使用Block就也可以做到限制的目的:

{    let j = 0;}

好~以上就是 let 跟 const 的基本概念，没有问题的话就继续往下巴~汪汪!