本文主要講解一下var與let在使用上的一些區(qū)別。
變量申明提升
var允許變量申明提前;但let不允許（即let必須申明之后才能使用）
console.log(num);
var num = 10;
// 輸出結(jié)果: undefined
console.log(num2);
let num2 = 20;
// 報(bào)錯(cuò)
塊級作用域
在ES6之前，只有函數(shù)存在塊級作用域一說(外部無法直接訪問函數(shù)內(nèi)部的變量)。在ES6中，由{}號包裹的區(qū)域就形成了一個(gè)塊級作用域，let申明的變量，只在當(dāng)前{}號內(nèi)有效。
for(var i = 0; i < 5; i++) {
}
console.log(i);
// 輸出結(jié)果為：5
for(let j = 0; j < 5; j++) {
}
console.log(j);
// 報(bào)錯(cuò)
變量重新申明
var允許重新定義某個(gè)變量;在同一個(gè)塊級作用域內(nèi),let不允許重新申明！
var num = 10;
var num = 20;
console.log(num);
// 輸出結(jié)果：20
// 同一塊級作用域
{
var num2 = 30;
let num2;
// 報(bào)錯(cuò)，提示num2已經(jīng)被申明
}
// 不同塊級作用域
{
let result = 1;
{
let result = 2;
}
console.log(result);
}
暫時(shí)性死區(qū)
網(wǎng)上很多資料對其解釋的比較繞，其實(shí)壓根就不需要太在意這些概念。
秉持一個(gè)原則：let必須先申明再使用！ let必須先申明再使用！ let必須先申明再使用！重要的事情說三遍！?。【涂梢员苊庠搯栴}。
let color = 'red';
function getColor() {
color = 'green';
let color;
return color;
}
getColor();
// 報(bào)錯(cuò)，雖然不同塊級作用域，可以重新申明變量，但是不允許在未申明之前直接使用
window對象
另外一個(gè)小的細(xì)節(jié)點(diǎn)，那就是window對象。
var a = 1;
window.a // 輸出結(jié)果為：1
let b = 2;
window.b // 輸出結(jié)果：undefined
const(具有l(wèi)et一樣的特性)
const申明變量時(shí)，需要注意2點(diǎn)：
-
申明后必須直接初始化，不能留在以后賦值，否則報(bào)錯(cuò); -
const申明的變量并不是固定不變的
針對第二點(diǎn)，單獨(dú)說明如下：
const MAX = 100;
MAX = 200;
// 報(bào)錯(cuò)，普通變量用const申明后，無法再修改
const Student = {
name: '小紅'
};
Student.name = '小明'; // 可以修改
Student = {}; // 報(bào)錯(cuò)
根據(jù)上面兩個(gè)例子可知：const申明的變量,如果是普通變量，確實(shí)無法再修改；但如果是引用類型的變量(數(shù)組、對象),則可以修改。也就是說，const申明的變量是不變的，指的是變量所指向的內(nèi)存地址的不變。
