在刚接触JavaScript中,自定义变量声明中接触最多的就是var,但是在最新的 ES6 中,新添加了两个用于变量声明的关键字 let 和 const,既然新添加了,肯定在使用上有所差别,接下来就一起探讨一下,便于我们在使用中区别开,提高效率和阅读性。
先补充一下有关js引擎运行的机制,js引擎运行JavaScript代码的时候分为两部分:
1.预解析,即js引擎会把js代码里面的所有以var,还有function提升到当前作用域(注意是当前作用域)的最前面;
1)变量提升,是指把所有的var变量声明提升到当前作用域的最前面,但是不提升赋值操作(注意没有进行赋值操作);
2)函数提升,是指把所有的function函数声明提升到当前作用域的最前面,但是不调用函数
2.代码执行,按照代码的书写顺序从上到下执行下来。
(PS:在这里给大家一个例子,大家有兴趣的话可以按着上面解释的自己做一下,把答案写在评论下面,自己再运行看看结果是否正确。)
f1();
console.log(b);
console.log(f);
var v = 88;
console.log(v);
console.log(a);
function f1() {
var a = b = f = 9;
console.log(a);
console.log(b);
console.log(f);
console.log(v);
}
他们的区别如下:
变量声明关键字 | 预解析 | 定义变量 | 循环体 |
var | 会进行预解析操作 | 1.变量如果没有定义使用,运行不会报错,但会返回undefined; 2.变量可以反复定义,相同的变量,后面的值会覆盖掉前面的值。 | 在循环体里面定义,循环体外面也可以进行调用 |
const | 不会进行预解析操作 | 1.变量在使用是必须先进行定义,否则运行会提示报错,且变量是不允许反复定义的; 2.不能定义之前定义过的变量(包括var和自身),但对于let定义的变量值是允许被修改的;对于const,定义的变量值是不允许被修改的。 | 在循环体里面定义,循环体外面不可以进行调用,会显示报错 |
let | |||
总结 | 在变量不需要改变的情况下,建议采用const,减少因为变量值得变动带来的代码误错,在变量需要变动的时候,建议采用let,即他们使用的顺序可以是let = const > var 其实只要前面两个,就能满足开发的所有需求,且便于其他人能更准的抓住变量的具体定义和用处。 |
循环体具体报错如下举例:
对于var举例:
<script>
const arr = [1, 2, 3, 4, 5];
for (var i = 0; i < arr.length; i++) {
console.log(i);
}
console.log(i);
</script>
结果:
对于let和const(以其中一个举例,另外一个同理)
<script>
const arr = [1, 2, 3, 4, 5];
for (let i = 0; i < arr.length; i++) {
console.log(i);
}
console.log(i);
</script>
结果: