參考文檔:https://es6.ruanyifeng.com/#docs/let
一、ES6簡介
ES6 是 5.1 版以後的 JavaScript 的下一代標準,本書中提到 ES6 的地方,一般是指 ES2015 標準,但有時也是泛指“下一代 JavaScript 語言”。
Babel
Babel 是一個廣泛使用的 ES6 轉碼器,可以將 ES6 代碼轉爲 ES5 代碼,從而在老版本的瀏覽器執行。
二、let和const
let
是塊級作用域,var
是函數作用域。
2、for循環使用let保證計數器只在循環體內有效,使用var運行結果可能會有差異
說明:
左例中的i是var聲明,全局範圍有效且只有一個變量i。此時result數組每一個元素中的i都是相同的。
右例中的i是let聲明,當前的i
只在本輪循環有效,每一次循環的i
其實都是一個新的變量。
注意:for
循環特別之處是設置循環變量的那部分是一個父作用域,而循環體內部是一個單獨的子作用域。
3、let不存在變量提升
var
命令會發生“變量提升”現象,即變量可以在聲明之前使用,值爲undefined
。
4、暫時性死區(temporal dead zone,簡稱 TDZ)
只要塊級作用域內存在let
命令,它所聲明的變量就“綁定”(binding)這個區域。
在代碼塊內,使用let
命令聲明變量之前,該變量是不可用。
4、1注意:“暫時性死區”意味着typeof
不再是一個百分之百安全的操作,不會報undefined!
typeof x; // ReferenceError
let x;
4、2隱蔽的死區
// 不報錯
var x = x;
// 報錯
let x = x;
// ReferenceError: x is not defined
5、不允許重複聲明:
let
不允許在相同作用域內,重複聲明同一個變量。
注意:不能在函數內部重新聲明參數,但是在for循環中可以
6、塊級作用域
ES5 只有全局作用域和函數作用域,沒有塊級作用域,出現如下問題:
(1)內層變量可能會覆蓋外層變量
(2)var聲明的計數循環變量泄露爲全局變量
ES6的塊級作用域
任意嵌套、內層作用域可以定義外層作用域的同名變量
7、塊級作用域與函數聲明
ES5:函數只能在頂層作用域和函數作用域之中聲明,不能在塊級作用域聲明
非法聲明
{
function a() {
}
}
ES6 :塊級作用域之中,函數聲明語句的行爲類似於let
,在塊級作用域之外不可引用
8、ES6的瀏覽器實現有自己的行爲方式如下
- 允許在塊級作用域內聲明函數。
- 函數聲明類似於
var
,即會提升到全局作用域或函數作用域的頭部。 - 同時,函數聲明還會提升到所在的塊級作用域的頭部。
const命令
1、const
聲明一個只讀的常量。一旦聲明,常量的值就不能改變,所以必須在聲明時給初值。
const a;
//SyntaxError: Missing initializer in const declaration
const a = 1;
a = 2;
//TypeError: Assignment to constant variable.
2、塊級作用域
const
的作用域與let
命令相同:只在聲明所在的塊級作用域內有效。
const
命令聲明的常量也是不提升,同樣存在暫時性死區,只能在聲明的位置後面使用。
特殊:const
實際上保證的,並不是變量的值不得改動,而是變量指向的那個內存地址所保存的數據不得改動。對於簡單類型的數據(數值、字符串、布爾值),值就保存在變量指向的那個內存地址,因此等同於常量。但對於複合類型的數據(主要是對象和數組),變量指向的內存地址,保存的只是一個指向實際數據的指針,const
只能保證這個指針是固定的(即總是指向另一個固定的地址),至於它指向的數據結構是不是可變的,就完全不能控制了。
例1:
const a = {"a":1};
a.a = 2;
console.log(a);
//輸出:
{ a: 2 }
例2:
const a = {};
a = {};
TypeError: Assignment to constant variable.
3、將對象凍結,應該使用Object.freeze
方法。
ES6聲明變量的6種方法:
var
、function
、let、const、import、class
頂層對象的屬性
頂層對象,在瀏覽器環境指的是window
對象,在 Node 指的是global
對象。ES5 之中,頂層對象的屬性與全局變量是等價的。
從 ES6 開始,全局變量將逐步與頂層對象的屬性脫鉤。