ES6學習筆記 let和const

2022-03-26 17:15:18 字數 2894 閱讀 2437

今天開始讀阮一峰的《ecmascript 6 入門》，在這裡記錄下閱讀過程中的要點，以便隨時查閱。

頂層物件的屬性與全域性變數掛鉤，被認為是js最大的敗筆之一，es6開始，全域性變數將逐步與頂層物件脫鉤。為了保持相容性，一方面,var和function宣告的全域性變數，依舊是頂層物件的屬性；另一方面，let,const,class命令宣告的全域性變數，不屬於頂層物件的屬性：

var a = 1;


window.a;//1


let b = 2;


window.b;//undefined
const 宣告乙個唯讀常量，一旦宣告就必須立即初始化，否則報錯；宣告之後不能修改，否則也會報錯；

const實際上保證的不是變數的值不可改動，而是變數指向的那個記憶體位址不得改動。使用const宣告引用型別，只能保證指標是固定的，但是指向的資料結構內的屬性和方法是可變：

const obj={};


obj.name = 'illidan';


obj.naem; // 'illidan';


obj = {}; //報錯，改變了指標的指向
let和const宣告的變數只在**塊內有效（**塊：大括號包起來的部分），在**塊外呼叫會報錯

let和const沒有變數提公升，因此在它們宣告之前呼叫變數會報錯

console.log(foo);//undefined


var foo = 'haha'


console.log(a); //reference error


let a = 'hehe';
let和const不允許在相同作用域內，重複宣告乙個變數：

function foo1()


function foo2()


function foo3()
因此不能在函式內部重新宣告引數：

function foo4(arg)


function foo5(arg)


}
for迴圈有個特別之處，迴圈語句是乙個父作用域，迴圈體內是乙個單獨的子作用域

for (let i = 0; i < 3; i++) 


//3*abc
只要塊級作用域內存在let或const,則它們宣告的變數就繫結了這個區域，不再受外部的影響，這個區域稱為暫時性死區（temporal dead zone），簡稱tdz

var temp = 123;


if(true)


var const = 1;


if(true)
tdz也意味著typeof不再是乙個百分百安全的操作

typeof undeclared_variable //undefined


typeof x;//reference error


let x;
有些tdz比較隱蔽：

function bar(x=y,y=2)


bar();//報錯，引數x預設等於引數y，而此時y還沒有宣告
修改之後

function bar(x=2,y=x);


bar();//[2,2]
使用let或者const宣告變數時，只有變數還在沒有宣告完成前使用，就會報錯:

var x = x;//undefined


let x = x; // reference error


const y = y; // reference error
總之，tdz的本質就是，只要一進入當前作用域，所要使用的變數就已經存在了，但是不可獲取，只有等到宣告變數的那一行**出現，才可以獲取和使用該變數

es5中只有全域性作用域和函式作用域，沒有塊級作用域，會帶來一些不合常理的場景：

第一種場景，內層變數可能會覆蓋外層變數

var temp = new date();


function f()


}f();//undefined
第二種場景，用來計數的迴圈變數洩露為全域性變數：

for(var i=0;i<10;i++);


console.log(i); //10
es6引入塊級作用域，明確允許在塊級作用域中宣告函式，行為類似於let,在塊級作用域之外不可引用

function f() 


(function () 


}  f();


}());
上面的**在es5中執行，會得到'i an inside!'

// es5 環境


function f() 


(function ()  //函式宣告提公升


if (false) 


f();


}());
es6理論上會得到'i am outside!',但是這樣處理會對老**產生很大的影響，為了相容老**，瀏覽器有自己的行為方式：

-允許在塊級作用域內宣告函式

-函式宣告類似於var,即函式名提公升到全域性作用域或塊級作用域頭部，函式體不提公升

-同時，函式宣告還會提公升到所在塊級作用域的頭部

因此，上面的**在es6瀏覽中實際執行的是：

// 瀏覽器的 es6 環境


function f() 


(function () 


}  f();


}());


//f is not a function;
要避免在塊級作用域裡宣告函式，如果確實需要，則要寫成函式表示式，而不是函式宣告

es6學習筆記 let和const

console.log b uncaught referenceerror a is not defined 在for迴圈中，迴圈語句部分是乙個作用域，內部又是乙個作用域 for let a 1 a 3 a 在let宣告變數完成前，對變數賦值會出錯es中模仿塊級作用域 function functi...

ES6 學習筆記 let和const

學習資料 ecmascript 6 入門 如果使用var，只有乙個全域性變數i var a for var i 0 i 10 i a 6 10var a for let i 0 i 10 i a 6 6設定迴圈變數的那部分是乙個父作用域，而迴圈體內部是乙個單獨的子作用域 for let i 0 i ...

ES6學習筆記之《let 和 const》

es6宣告變數的方法 var function let const import class let和 const const的作用域與let命令相同 只在宣告所在的塊級作用域內有效。if true max uncaught referenceerror max is not defined con...