var与let的区别

var与let的区别

前言:

　　在没接触Es6之前，我们在js中声明都是通过var来声明变量的，var声明变量虽说方便，但是，又有一些自己的诟病，下边来说一说，这三个的区别！

var

　　var相信大家都不陌生，前端在日常编程中，谁也离不开他，他的合理运用，让我们编写出适合自己的，适合浏览器的程序！

console.log(a)//undefind
var a=2;

　　都知道我们前端程序都是自上而下执行，为什么他没发现ａ这个变量他的值变成了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的一些区别！