前端巩固-6、let var const区别

在JavaScript中，我们可以使用var,let,const等关键字声明一个变量

var

使用var声明变量，相当于声明一个全局变量，我们知道在浏览器中，window是全局对象，所以全局变量是window对象的属性，因此使用var声明变量，相当于往window对象声明一个属性

var a = 10;
console.log(window.a == a);//输出true

let

let是ES6新增的用于代替var关键字，使用let声明的变量，有以下几个特征：

变量不能在声明前使用
变量声明后不能再次声明
不存在变量提升
变量可以有块级作用域

let a = 1;
let a = 2;//再次声明，报错

console.log(b);//在声明之前使用，报错
let b = 2;

{
    let c = 3;//只在当前作用域有效
}

console.log(c);//读取一个未声明的变量，报错

const

const用于声明一个常量，所谓常量，即声明的变量时必须赋值，且在之后使用过程不能重新赋值
与let一样，const声明的变量，也不存在变量提升，且只在声明后才生效，如果存在块级作用域，在作用域之外则无法读取该变量的值。

另外，前面我们说const声明的变量不允许重新赋值，但如果使用const声明一个对象或数组等引用类型常量，虽然同样无法重新给该常量赋值，但却可以修改对象的属性和数组的元素

const a = {x:1,y:2}

a.name = 'test'//给对象添加一个属性，可以执行

a = {name:'test'}//重新赋值，报错


const a = [];

a.push('6666'); // 给数组添加一个元素，可以执行

a.length = 0;    // 重置数组的长度，

a = ['test'];    // 重新赋值，报错

原文链接https://mp.weixin.qq.com/s?src=11&timestamp=1649597955&ver=3730&signature=WCROas3rYDVmGuxfAsyBWcyY0KbUrV-0ym5PMQsWPLBQsih72WK7Z8GQlTUBbMbBOS21xRBtxDUF1kq6SnM68mIqy-uzUbZ1DfKtbcz1aBxwKZAa7oOqEZuIUkmw&new=1

区别

从下面五个小点区分

1、变量提升

var存在变量提升，变量可以在声明之前就调用
let、const 不存在变量提示，变量不可以在声明之前就调用
变量提升即变量可以在声明之前就调用，值为undefined（未定义）

console.log(a) //undefined
var a = 10

console.log(b) //报错
let b = 10

2、暂时性死区

var不存在暂时性死区
let和const存在暂时性死区，只有等到声明变量的那行代码出现，才可以获取和使用该变量

console.log(a) //undefined
var a = 10

console.log(b) //报错
let b = 10

3、重复声明

var允许重复声明变量
let、const不允许，在同一作用域下不允许重复声明变量

var a = 10;
var a = 20;

let b = 10;
let b = 20: //报错
//const也是

4、修改声明变量

var和let可以
const不可以
因为const声明一个只读变量，一旦声明，值就不可以改变

var a = 10;
a = 20;

let b = 10;
b = 20;

const c = 10;
c = 20; //报错

5、块级作用域

var不存在块级作用域
let和const存在块级作用域

<script>
        {
            var a = "a";
        }
        console.log(a);

        let b = "b";
        {
            let b = "作用域b";
        }
        console.log(b);

    </script>

总结