二.作用域-let

• 1.塊變數
• 2.塊函式

1.塊變數

let 塊範圍的變數（和常量）沒有提升。（ES6中 let和const關鍵字定義的變數和常量不會被提升）。 ECMAScript 6

for (let i=0;i<a.length;i++) {
   let x = a[i];
   ...
}
for (let i=0;i<b.length;i++) {
   let y = b[i];
   ...
}
let callbacks = [];
for (let i=0;i<=2;i++) {
   callbacks[i] = function(){ rertun i*2 }
}
callbacks[0]() === 0;
callbacks[1]() === 2;
callbacks[2]() === 4;
 

ECMAScript 5

var i,x,y;
for (i=0; i<a.length; i++) {
   x = a[i];
   ...
}
for (i=0; i<b.length; i++) {
   y = b[i];
   ...
}
var callbacks = [];
for (var i = 0; i <=2; i++){
//因為變數提升的問題，立即執行才能得到上述ES6的效果
   (function (i) {
       callbacks[i] = function(){ return i*2; };
   })(i);
}
callbacks[0]() === 0;
callbacks[1]() === 2;
callbacks[2]() === 4;
 

2.塊函式

塊函式定義 ECMAScript 6

{
   function foo () { return 1}
   foo() ===1
   console.log(foo());
   {
      console.log(foo());
      function foo(){return 2}
      foo() ===2
      console.log(foo()); 
    }
    foo() ===1
    console.log(foo());
}
// 一個花括號就是一個獨立的作用域，子作用域影響不到父作用域
//console.log（foo()）的值依次為1 2 2 1
 

ECMAScript 5

//僅在ES5中藉助於塊範圍模擬函式作用域和函式表示式
(function(){
   var foo = function () {return 1};
   console.log(foo());//1
   foo() === 1;
  (function () {
     console.log(foo());//2
     var foo = function() {return 2;}
     console.log(foo());//3
     foo() === 2;
   })();
   foo() === 1;
   console.log(foo());//4
})()
//因為在第二個函式作用域內，在沒有定義foo函式之前呼叫了，所以console.log(foo());//2
//會報錯；去掉第二個console.log(foo())，打印出來的結果為1，2，1