使用默認(rèn)參數(shù)時(shí)，參數(shù)會(huì)形成一個(gè)獨(dú)立的作用域，此作用域與函數(shù)體中的作用域是平行關(guān)系

var x = 0;
function foo(x, y = function(){ x = 2; console.log(x); }) {
    var x = 3;
    y();
    console.log(x);
}
foo();
console.log(x);

經(jīng)過測試發(fā)現(xiàn)，此段代碼如果使用babel編譯成es5~輸出結(jié)果為 2 2 0

Paste_Image.png

這個(gè)結(jié)果和開頭的結(jié)論并不符合~原因我暫時(shí)將其理解成babel的編譯和原本es6的語法定義還是有點(diǎn)出入的
編譯后的代碼如下：

var x = 0;
function foo(x) {
  var y = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {
    x = 2;console.log(x);
  };

  var x = 3;
  y();
  console.log(x);
}
foo();
console.log(x);

而將es6代碼直接復(fù)制到支持es6語法的瀏覽器中執(zhí)行~得到結(jié)果為：

Paste_Image.png

解釋如下：

參數(shù)y有一默認(rèn)值為一匿名函數(shù)，一整個(gè)參數(shù)列表形成一個(gè)獨(dú)立的作用域，在匿名函數(shù)中沒有定義x，故找到了外部的x即第一個(gè)參數(shù)x，然后賦值為2，并輸出，所以第一行輸出2，然后在foo函數(shù)體中聲明了變量x并賦值為3，但此句過后執(zhí)行匿名函數(shù)，并沒有影響到foo函數(shù)體中的x最后最后輸出3，這就是我一開始說的參數(shù)形成的獨(dú)立作用域與函數(shù)體中的作用域是平行的_{匿名函數(shù)中的變量x在沒有聲明的情況下應(yīng)該是沿著作用域鏈往上找}而往上找的時(shí)候并不是找到foo函數(shù)體中定義的x而是找到形參列表中的第一個(gè)參數(shù)x，所以匿名函數(shù)中x = 2；這句并沒有修改到foo函數(shù)體中的x的值，由此也證明foo函數(shù)體的作用域和形參列表的獨(dú)立作用于并不是上下級關(guān)系

再來看個(gè)例子：

var x = 0;
function foo(x, y = function(){ console.log(x); x = 2; console.log(x); }) {
    x = 3;
    y();
    console.log(x);
}
foo();
console.log(x);

結(jié)果為：

Paste_Image.png

解釋：
此例foo函數(shù)體中并沒有用var重新聲明變量x，所以此處x就是傳進(jìn)來的參數(shù)x（平時(shí)我們調(diào)用函數(shù)也是這種寫法，至少調(diào)用函數(shù)的時(shí)候不會(huì)在函數(shù)體中對傳進(jìn)來的形參再聲明一邊，不然傳進(jìn)來干嘛~~）匿名函數(shù)中變量x沒有聲明，此處的x就是外層變量x即形參列表中第一個(gè)參數(shù)x，那最后得出3 2 2的結(jié)果也就不難理解了