三者的区别：
- const 声明常量，后面不能修改
- let 声明变量，块作用域，后面不能覆盖之前声明的值
- var 声明变量，函数作用域，后面能覆盖之前声明的值
下面具体说明使用方法：
-
const 声明常量，后面不能修改
<script>
const id = 'dddd';
id = 'dfd'; //这里会报错
</script>
const 修改报错
我们可以借助这个属性声明一个不可修改的类：
const person = {
name: 'hello',
age: 20
}
person.age = 22;
console.log(person);
//不能修改属性 这时es5新增的属性
const he = Object.freeze(person);
he.age = 1;
console.log(he);
两次输出的结果都一样的，通过 Object.freeze声明的变量是无法修改类的属性的
-
let 声明变量，块作用域，后面不能覆盖之前声明的值
<script>
var price = 100;
var count = 10;
if (count > 5) {
let discount = price * 0.6;
console.log(`the discount is ${discount}`);
}
</script>
let声明不是全局变量
-
var 声明变量，函数作用域，后面能覆盖之前声明的值
<script>
var price = 100;
var price = 60; //这里能覆盖声明
var count = 10;
if (count > 5) {
var discount = price * 0.6;
console.log(`the discount is ${discount}`);
}
</script>
var声明的是全局
个人见解：
如果是全局变量声明后不再修改的，比如配置参数等用const声明，如果导入的库文件以及方法内部变量用let，全局的变量用var，尽量少使用var去污染全局变量。
仅是个人见解，如有不妥请指正。
在实际使用中：
for循环使用频率很高，但是有个问题估计很少有人注意到。
for (var i = 0; i<10; i++) {
console.log(i);
}
console.log(i)
这里控制台输出的i是10。
图片.png
这里如果用let的话，i就变成了块级作用域，出了循环也就没有了。
for (let i = 0; i<10; i++) {
console.log(i);
setTimeout(function(){
console.log(`i:${i}`);
},1000);
}
console.log(">>"+i)
图片.png
[获取授权]
