ES6聲明變量的六種方式:let、const(變量爲只讀常量,一旦聲明,不能修改)、class、import、var、function —— 其中var、function是ES5聲明變量的方式(全局)
簡單說明ES6的變量:
1.在所在的區域塊內纔有效
var a = [];
for (var i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 10
------------------------------------------
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 6
2.不存在變量提升
console.log(foo);
var foo = 2; //2
----------------------------------------
console.log(foo);
let foo = 3; //報錯
3.暫時性死區
if (true) {
// TDZ開始
tmp = 'abc'; // ReferenceError
console.log(tmp); // ReferenceError
let tmp; // TDZ結束
console.log(tmp); // undefined
tmp = 123;
console.log(tmp); // 123
}
其中typeof也不是百分之百安全的操作: typeof x; //報錯 let x; 因爲x使用let聲明,在聲明之前都是x的“死區”
4.不允許重複聲明變量與參數
function func(arg) {
let arg;
}
func() // 報錯
function func(arg) {
{
let arg;
}
}
func() // 不報錯
------------------------------------------
// 報錯
function func() {
let a = 10;
var a = 1;
}
// 報錯
function func() {
let a = 10;
let a = 1;
}
瞭解一下塊級作用域與函數聲明
ES5規定:函數只能在頂層作用域與函數作用於之中聲明,不能再塊級作用域聲明。
// 情況一
if (true) {
function f() {}
}
// 情況二
try {
function f() {}
} catch(e) {
// ...
}
ES6規定:塊級作用域中,函數聲明語句作用類似於let,在塊級作用於之外不做引用。
function f() { console.log('I am outside!'); }
(function () {
var f = undefined;
if (false) {
function f() { console.log('I am inside!'); }
}
f();
}());
理論上會返回“I am inside!”,但是在ES6的瀏覽器報錯。因爲環境差異太大,應該避免在塊級作用域內聲明函數,如果確實需要,可以將函數修改爲函數表達式,例如:
// 塊級作用域內部的函數聲明語句,建議不要使用
{
let a = 'secret';
function f() {
return a;
}
}
// 塊級作用域內部,優先使用函數表達式
{
let a = 'secret';
let f = function () {
return a;
};
}
this對象
全局環境:this => 頂層對象
Node模塊和ES6模塊:this => 當前模塊
任何環境:globalThis => 頂層對象