刚接触vue的时候,用的最多的就是var,觉得就是声明变量的,再深入就没有了解了,借着这次的项目,稍微深入了解一下这几个东西。
vue-var
用var命令声明的变量,是在全局范围内有效的,举栗子:
var a = [];
for (var i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6]();
上面这段代码中,循环变量i是用var命令声明的,因此是在全局范围内都有效,所以全局只有一个变量i。每一次循环,变量i的值都会发生改变,而循环内被赋给数组a的函数内部的console.log(i),里面的i指向的就是全局的i。也就是说,所有数组a的成员里面的i,指向的都是同一个i,导致运行结束后,输出的i的值是 10,而不是6。
// var 的情况
console.log(foo); // 输出undefined
var foo = 2;
相信一般不会有人这么写的,这样的声明有些奇怪,不按常理出牌,按照逻辑是声明后使用的,要不然会报错;为了纠正这种奇怪的现象,let命令只能在声明后才能使用。
VUE-let
let声明,只是在代码块中有效。如果上个循环中的var变成let声明,结果就大不一样了。
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6]();
这里的结果是6,因为let声明的变量,只是在当前循环的代码块中有效。
let不允许在相同的作用域内重复声明同一个变量;但是可以在块级作用域中的声明,
function func(test) {
let test; // 报错
}
function func(test) {
{
let test; // 不报错
}
}
VUE-const
const声明一个只读的常量。所谓常量,即一旦声明,值就不能改变。
const声明的变量不能改变值,这说明,const一旦声明变量,就必须立即初始化,不能留到以后赋值。
const的作用域与let相同:只在声明所在的块级作用域内有效。