转前端 vue.js 学习笔记-1.2-使用 let 与 const 定义常量变量
0 / 0 / 创建于 5年前 /
wangchunbo 的个人博客
定义变量常量#
let#
let 定义常量
const#
const 定义变量
为什么不使用 var#
最简单的答案就是 let 提供块作用域 (block-scoping)，这会比 var 提供的以函数为作用域有更加精细化的控制。
如下一个例子：
问题：在下面的例子中，请说出控制台的打印结果。#
var callbacks = [];
(function() {
for (var i = 0; i < 5; i++) {
callbacks.push( function() { return i; } );
}
})();
console.log(callbacks.map( function(cb) { return cb(); } ));我们将 for 循环执行五次，每次将一个函数 push 到 callbacks 数组中。最后 callbacks 数组里面的每一个函数的执行结果打印出来。
一个新手工程师经过深思熟虑可能会回答 [0, 1 , 2, 3, 4], 然而却掉入了 JavaScript 的”hoisting 陷阱”。
只有当你理解了 hoisting， 才能给出正确的答案 [5, 5, 5, 5, 5]。
var callbacks = [];
(function() {
var i;
for (i = 0; i < 5; i++) {
callbacks.push( function() { return i; } );
}
})();
console.log(callbacks.map( function(cb) { return cb(); } ));注意上面的代码，JavaScript 将变量提升到函数定义的顶部，经过整个 for 循环，callbacks 里面存储的 5 个函数指向的同一个变量 i 的值已经是 5。所以最终打印出来的值都为 5。
在以前要通过各种奇淫技巧来解决这个问题，并成功返回 [0, 1, 2, 3, 4], 现在我们有了 let，就可以很简单解决问题：
var callbacks = [];
(function() {
for (let i = 0; i < 5; i++) {
callbacks.push( function() { return i; } );
}
})();
console.log(callbacks.map( function(cb) { return cb(); } ));因为 let 拥有块作用域，所以使用 let 声明的变量 i 不会被提升到函数顶部，i 的作用域在 for 循环， 就会每次循环有独立的值。
那我们是不是应该不要使用 var 了呢？如果你想要一个变量拥有函数作用域，var 还是很有用的。
本作品采用《CC 协议》，转载必须注明作者和本文链接
关于 LearnKu
粤公网安备 44030502004330号