var与let的区别
前言:
在没接触Es6之前,我们在js中声明都是通过var来声明变量的,var声明变量虽说方便,但是,又有一些自己的诟病,下边来说一说,这三个的区别!
var
var相信大家都不陌生,前端在日常编程中,谁也离不开他,他的合理运用,让我们编写出适合自己的,适合浏览器的程序!
console.log(a)//undefind
var a=2;
都知道我们前端程序都是自上而下执行,为什么他没发现a这个变量他的值变成了undefind,这就说到了我们var自带的变量提升,在没有声明这个变量之前,你这个变量具有全局的属性,都会进行变量提升!
它的实际样子是这样的
var a;
console.log(a)//undefind
var a=2;
大家这个样子就看懂了吧!
var与let
{
let a = 10;
var b = 1;
}
a // ReferenceError: a is not defined.
b // 1
大家都看到了,var声明的b在花括号外边打印出来,而let却报了一个错误!这就是let与咱们var 的区别,它的变量是区域的,也就是区域变量!
//在来看一个例子
if (true) {
tmp = 'abc'; // ReferenceError
console.log(tmp); // ReferenceError
let tmp;
console.log(tmp); // undefined
tmp = 123;
console.log(tmp); // 123
}
上面代码中,在let命令声明变量tmp之前,都属于变量tmp的“死区”
// var 的情况
console.log(foo); // 输出undefined
var foo = 2;
// let 的情况
console.log(bar); // 报错ReferenceError
let bar = 2;
var命令会发生”变量提升“现象,即变量可以在声明之前使用,值为undefined。这种现象多多少少是有些奇怪的,按照一般的逻辑,变量应该在声明语句之后才可以使用。
为了纠正这种现象,let命令改变了语法行为,它所声明的变量一定要在声明后使用,否则报错。
function f1() {
let n = 5;
if (true) {
let n = 10;
}
console.log(n); // 5
}
上边这个变量如果用var声明的话会打印出10,而let声明的还是5,这就是块级作用域吧!都知道咱们的var有函数作用域域全局全用域,来咱们的let是块级作用域!他带来了很多好处!
var s = 'hello';
for (var i = 0; i < s.length; i++) {
console.log(s[i]);
}
console.log(i);//5
函数在执行完之后泄露成了全局变量,而用let声明的则没有这一点
let s = 'hello';
for (let i = 0; i < s.length; i++) {
console.log(s[i]);
}
console.log(i);//Uncaught TypeError: i is not a function
es6新增的let变成了块级可以防止内存泄露。。。好处还是很多的,这就是let与var的一些区别!