var与let、const的区别

一、基础区别
1.var定义变量，没有块的概念，可以跨块访问，不能跨函数访问，不初始化出现undefined，不会报错
2. let定义变量，只能在块作用域里访问，也不能跨函数访问，对函数外部无影响。
3. const定义常量，只能在块作用域里访问，也不能跨函数访问，使用时必须初始化(即必须赋值)，而且不能修改。

<script type="text/javascript">
    // 块作用域
    {
　　　　 var a = 1;
        let b = 2;
        const c = 3;
        // c = 4; // 报错，const不能修改

        var aa;
        let bb;
        // const cc; // 报错，必须初始化(即必须赋值)

        console.log(a); // 1
        console.log(b); // 2
        console.log(c); // 3
    }
    console.log(a); // 1
    // console.log(b); // 报错，只能在块作用域里访问
    // console.log(c); // 报错，只能在块作用域里访问

    // 函数作用域
    (function A() {

        var d = 5;
        let e = 6;
        const f = 7;

        console.log(d); // 5
        console.log(e); // 6  (在同一个{ }中,也属于同一个块，可以正常访问到)
        console.log(f); // 7  (在同一个{ }中,也属于同一个块，可以正常访问到)

    })();
　　
　　// console.log(d); // 报错，不能跨函数访问 
　　// console.log(e); // 报错，不能跨函数访问 
　　// console.log(f); // 报错，不能跨函数访问 
</script>

二、var声明的变量会挂载在window上，而let和const声明的变量不会：

var a = 100;
console.log(a,window.a);    // 100 100

let b = 10;
console.log(b,window.b);    // 10 undefined

const c = 1;
console.log(c,window.c);    // 1 undefined

三、var声明变量存在变量提升，let和const不存在变量提升

console.log(a); // undefined  ===>  a已声明还没赋值，默认得到undefined值
var a = 100;

console.log(b); // 报错：b is not defined  ===> 找不到b这个变量
let b = 10;

console.log(c); // 报错：c is not defined  ===> 找不到c这个变量
const c = 10;

四、let和const声明形成块作用域

if(1){
    var a = 100;
    let b = 10;
}

console.log(a); // 100
console.log(b)  // 报错：b is not defined  ===> 找不到b这个变量

if(1){

    var a = 100;
        
    const c = 1;
}
 console.log(a); // 100
 console.log(c)  // 报错：c is not defined  ===> 找不到c这个变量

五、同一作用域下let和const不能声明同名变量，而var可以

var a = 100;
console.log(a); // 100

var a = 10;
console.log(a); // 10
let a = 100;
let a = 10;

六、const命令的基本使用
const用来声明常量，一旦声明，其值就不能更改

const a = 10;
    a = 20;

 console.log(a);//Uncaught TypeError: 
                 Assignment to constant variable.

1.const声明的常量不能改变，意味着const一旦声明常量，就必须同时初始化。不能先声明，后初始化，这样会报错

2.与let一样。const声明的常量也只在块级作用域内有效
3.与let一样，必须先声明，后使用
4.与let一样，在同一作用域，const不能重复声明同一常量

那么如果使用const声明对象呢？

const b = {
        name:'zs',
        age:22
    }
b.name = "lzx";

console.log(b.name+"---"+b.age);//输出lzx---22

我们可以看到，使用const声明的对象的属性是可以修改。
因为Object类型是引用类型。用const声明常量保存的是对象的地址，不可变的是地址，在上面的代码中就是，不能把 b 指向另一个对象。而修改对象的属性，并不会改变对象的地址，因此用const声明对象的属性是可以修改的
数组也是引用类型，同理，不再赘述

七、暂时性死区

var tmp = 123;

if (true) {
   tmp = 'abc'; // ReferenceError
   let tmp;
}

上面代码中，存在全局变量tmp，但是块级作用域内let又声明了一个局部变量tmp，导致后者绑定这个块级作用域，所以在let声明变量前，对tmp赋值会报错。

ES6明确规定，如果区块中存在let和const命令，这个区块对这些命令声明的变量，从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量，就会报错。

总之，在代码块内，使用let命令声明变量之前，该变量都是不可用的。这在语法上，称为“暂时性死区”（temporal dead zone，简称TDZ）。

HTML:

• 0
• 1
• 2
• 3

JS: window.onload = function(){ var aLi = document.getElementsByTagName('li'); for (var i=0;i

window.onload = function(){
var aLi = document.getElementsByTagName(‘li’);
for (let i=0;i<aLi.length;i++){
aLi[i].onclick = function(){
alert(i);
}
};
}
有看出什么区别吗？奥秘就在for循环中var i=0变成了let i=0，我们仅仅只改了一个关键字就解决了这个问题，还避免了使用闭包可能造成的内存泄漏等问题。

上述代码中的for 循环头部的 let 不仅将 i 绑定到了 for 循环的块中， 事实上它将其重新绑定到了循环的每一个迭代中， 确保使用上一个循环迭代结束时的值重新进行赋值。
参考文献https://www.cnblogs.com/zhuoshen/p/9577220.html
https://blog.csdn.net/ryelqy/article/details/84936092