ES6新增let用法和特点

一.let命令

1.基本用法

ES6新增了let命令，用来声明变量。它的用法类似于var，但由它声明的变量，只在let命令所在的代码块内有效。

let a;
let a,b,c;
let a = 1,b = 'hello',c = [];

2.特点

let命令只在声明所在的块级作用域内有效。

{
    var a = 1;
    let b = 10;
}
console.log("a",a); // a 1
console.log("b",b); // b is not defined  -- Error

let命令声明的常量不存在变量提升，必需先声明、后使用。

var tmp = new Date();
function f() {
	console.log("111",tmp); // tmp is not defined  -- Error
	let tmp = "hello world";  // var tmp = "hello world";
	console.log("222",tmp);
}
f();
console.log("333",tmp);

let声明的变量不可重复声明。

var message = "Hello!";
var age = 25;

// 以下两行都会报错
let message = "Hi!";
const age = 30;

ES5 只有全局作用域和函数作用域，没有块级作用域。这带来很多不合理的场景。

1.内层变量可能会覆盖外层变量

var tmp = new Date();
function f() {
  console.log(tmp);
  if (false) {
    var tmp = 'hello world';
  }
}
f(); // undefined

2.用来计数的循环变量泄露为全局变量

var s = 'hello';
for(var i = 0; i< s.length; i++){
    console.log("i",i);
}
console.log("i",i);

ES6中，let实际上为 JavaScript 新增了块级作用域。ES6 允许块级作用域的任意嵌套。

// 示例一
function f1() {
  let n = 5;
  if (true) {
    let n = 10;
  }
  console.log(n);  // 5
}
f1();

// 实例二
var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log("msg1",i);
  };
}
a[6]();  // msg1 10
console.log("msg2",i);  // msg2 10


var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log("msg1",i);
  };
}
a[6]();  // msg1 6
console.log("msg2",i);  // i is not defined -- Error