var
var 聲明變量的作用域
//全局作用域
var a = 12;
console.log(window.a); // 12
//局部(函數(shù))作用域
function add() {
var b = 13;
console.log(b); // 13
}
// 外面訪問會報(bào)錯,只在 add() 內(nèi)訪問有效
console.log(b); // ReferenceError
不帶 var 關(guān)鍵字的聲明會默認(rèn)聲明到全局變量上
瀏覽器指的是 window;Node環(huán)境指的是 global
//Node環(huán)境:xxx.js
a = 12;
console.log(global.a); //12
//瀏覽器環(huán)境
a = 10;
console.log(window.a); // 10
而如果在函數(shù)內(nèi)不使用var聲明變量侥衬,該變量是全局的
var a = 10;
function noVar() {
a = 20;
}
noVar();
console.log(a); // 20
var的變量提升
console.log(a); // undefined
var a = 12;
在編譯階段襟齿,編譯器會將其變成以下執(zhí)行
var a
console.log(a); // undefined
a = 12;
使用var,我們能夠?qū)σ粋€變量進(jìn)行多次聲明,后面聲明的變量會覆蓋前面的變量聲明
var a = 22
var a = 33
console.log(a); // 33
let
塊級作用域
{
let a = 12;
}
console.log(a); // ReferenceError
不會被變量提升&&暫時性死區(qū)
console.log(a);
let a = 12; // ReferenceError
var a = 123
if (true) {
a = 'abc' // ReferenceError
let a;
}
不能重復(fù)聲明
var a;
let a; // SyntaxError
let b;
var b; // SyntaxError
非同級不會報(bào)錯
let a = 20
{
let a = 30
}
const
大體上與 let 相同
const聲明一個只讀的常量岳守,一旦聲明汇鞭,常量的值就不能改變
const a = 1
a = 3
// TypeError: Assignment to constant variable.
這意味著凉唐,const一旦聲明變量,就必須立即初始化霍骄,不能留到以后賦值
const a;
// SyntaxError: Missing initializer in const declaration
const實(shí)際上保證的并不是變量的值不得改動台囱,而是變量指向的那個內(nèi)存地址所保存的數(shù)據(jù)不得改動
const foo = {};
// 為 foo 添加一個屬性,可以成功
foo.prop = 123;
foo.prop // 123
// 將 foo 指向另一個對象读整,就會報(bào)錯
foo = {}; // TypeError: "foo" is read-only
var let const 不同之處
重復(fù)聲明
var a;
var a;
let b;
let b; // SyntaxError
const c = 1;
const c = 2; // SyntaxError
變量提升
console.log(a); // undefined
var a = 10;
console.log(b); // Cannot access 'b' before initialization
let b = 10;
console.log(c); // Cannot access 'c' before initialization
const c = 10;
暫時性死區(qū)
var不存在暫時性死區(qū)
let和const存在暫時性死區(qū)簿训,只有等到聲明變量的那一行代碼出現(xiàn)值桩,才可以獲取和使用該變量
console.log(a); // undefined
var a = 10;
console.log(b); // Cannot access 'b' before initialization
let b = 10;
console.log(c); // Cannot access 'c' before initialization
const c = 10;
塊級作用域
var不存在塊級作用域
let和const存在塊級作用域
// var
if (true) {
var name = 'Matt';
console.log(name); // Matt
}
console.log(name); // Matt
// let
if (true) {
var name = 'Hello';
console.log(name); // Hello
}
console.log(name); // ReferenceError
// const 同 let
修改聲明的變量
var和let可以
const聲明一個只讀的常量蚯撩。一旦聲明,常量的值就不能改變
// var
var a = 10;
a = 20;
console.log(a); // 20
//let
let b = 10;
b = 20;
console.log(b); // 20
// const
const c = 10;
c = 20;
console.log(c); // Uncaught TypeError: Assignment to constant variable
頂層作用域聲明是否置于 window 對象上
var 會,let const不會
var a = 12;
console.log(window.a); // 12
let b = 13;
console.log(window.b); // undefined
const c = 15;
console.log(window.c); // undefined
建議
所有變量一律優(yōu)先使用 const 聲明向挖,如果該變量需要后期修改值崎溃,使用 let 替換运敢,不使用 var
擴(kuò)展
定義多個變量
let a = 12;
let b = 13;
// 簡寫
let a = 12,
b = 13;
let 解決循環(huán)問題
// 輸出 5 次 5
for (var i = 0; i < 5; i++) {
setTimeout(() => console.log(i), 0);
}
// 閉包
for (var i = 0; i < 5; i++) {
setTimeout((function(){console.log(i)})(i), 0);
}
// 輸出 0 1 2 3 4
for (let i = 0; i < 5; i++) {
setTimeout(() => console.log(i), 0);
}