es6中 var 和 let的区别

区别1:var没有块级作用域,只有 函数级作用域 和 全局作用域;let有块级作用域

function fn() {
    { var a = 10; }
    console.log(a)  //输出10
}
fn()
function fn() {
    { let a = 10; }
    console.log(a)  //报错,a未定义
}
fn()

区别2:let只能先声明后引用;var可以在声明前引用,但声明前引用的值一律是undefined

function fn() {
    console.log(a) // 报错,a 未定义
    let a = 10;
}
fn()
function fn() {
    console.log(a) // undefined
    var a = 10;
}
fn()

区别1和区别2 社区里合起来的叫法就是:var会引起变量提升,let不会

区别3:var可重复声明,后续声明会覆盖前面的;let同一作用域内只能声明一次,且不能和var声明的变量同名

这个就不举例了,自己去试。

区别4:浏览器中,var声明的全局变量,是挂载在全局对象window上的;let声明的全部变量没有挂在全局对象上

    let a = 5;
    var b = 6;
    console.log(window.a, window.b)  // 输出undefined,6

区别5:就是for循环了

for (let i = 0; i < 10; i++) {
    setTimeout(() => {
        console.log(i);    // 输出 0 到 9
    }, 10);
}
for (var i = 0; i < 10; i++) {
    setTimeout(() => {
        console.log(i);    // 输出 10 个 10
    }, 10);
}

在给结论前,先看另外两个关于let的例子:

let i = 0
for (; i < 10; i++) {
    setTimeout(() => {
        console.log(i);    // 输出 10 个 10
    }, 10);
}
for (let i = 0; i < 10; ) {
    setTimeout(() => {
        console.log(i);    // 输出 1 到 10
    }, 10);
    i++
}

当 i 在循环中的块级作用域时,每次循环都会创建一个全新的变量,并且锁定一个独立的作用域。

原文地址:https://www.cnblogs.com/zhwc-5w4/p/12024916.html