大家好，我是拾七，持续给大家补给前端干货🔥
JavaScript有三种方式来声明变量：var、let和const。它们之间有一些区别，主要涉及到作用域、变量提升和是否可重新赋值等方面。
作用域
作用域是指程序源代码中定义变量的区域。规定了如何查找变量，也就是确定当前执行代码对变量的访问权限。JavaScript 采用词法作用域(lexical scoping)，也就是静态作用域。因为 JavaScript 采用的是词法作用域，函数的作用域在函数定义的时候就决定了。而与词法作用域相对的是动态作用域，函数的作用域是在函数调用的时候才决定的。
在ES5中，顶层对象的属性和全局变量是等价的，用var声明的变量既是全局对象，也是顶层变量。PS：顶层对象，在浏览器环境指的是window对象，在Node指的是global对象。
var a = 10;
console.log(window.a); // 10
使用var声明的变量存在变量提升的情况
console.log(a) // undefined
var a = 10;
在编译阶段，编译器会将其变成以下执行。
var a
console.log(a)
a = 20
使用var，我们能够对一个变量进行多次声明，后面声明的变量会覆盖前面的变量声明
var a = 20
var a = 30
console.log(a) // 30
在函数中使用var 声明变量时候，该变量是局部的。
var a = 20;
function change() {
var a = 30;
}
change();
console.log(a) // 20
如果在函数内不使用var，改变量是全局的
var a = 20;
function change() {
a = 30;
}
change();
console.log(a) // 30
Let
let是es6新增的关键字，声明变量。用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。
{
let a = 20;
}
console.log(a); // not defined
不存在变量提升
console.log(a); // 报错
let a = 20;
这表示在声明它之前，变量a是不存在的，这时如果用到它，就会报错，只要块级作用域内存在let命令，这个区域就不再受外部影响。
var a = 1;
if(true) {
a = 'a'; // 报错
let a;
}
使用let声明变量前，该变量都不可用，也就是大家常说的“暂时性死区”最后，let不允许在相同作用域中重复声明
function f(a) {
let a;
}
f(); //报错
Const
const是声明一个只读的常量，一旦声明，常量的值就不能改变。const实际上保证的并不是变量的值不许改变，而是变量指向的那个内存地址所保存的数据不许改变。对于简单类型的数据，值就保存在变量指向的那个内存地址，因此等同于常量对于复杂类型的数据，变量指向的内存地址，保存的只是一个指向实际数据的指针，const只能保证这个指针是固定的，并不能确保该变量的结构不变。
const foo = {};
foo.prop = 123
foo = {};
其它情况，const与let一致
总结三者区别
const、var、let三者区别可以围绕下面五点展开：
-
变量提升
-
暂时性死区
-
块级作用域
-
重复声明
-
修改声明的变量
-
使用
后续，会给大家分享之前面试大厂被问到的一些问题，另附解析，干货干货 !🔥
点击上方蓝字关注我
