ES6 关键字 let 和 ES5 及关键字 var 的区别解析

1. 声明和作用域

• 在ES5中，使用var关键字声明变量，而在ES6中，可以使用let关键字声明变量。
• 使用var声明的变量具有函数作用域，而使用let声明的变量具有块级作用域。

示例1：

// ES5
function example1() {
  if (true) {
    var x = 5;
  }
  console.log(x); // 输出 5
}
example1();

// ES6
function example2() {
  if (true) {
    let y = 10;
  }
  console.log(y); // 报错：y is not defined
}
example2();

在示例1中，使用var声明的变量x在整个函数作用域内都是可见的，所以在console.log(x)语句中可以正常访问到x的值。而在示例2中，使用let声明的变量y只在if语句块内部有效，所以在console.log(y)语句中无法访问到y的值，会报错。

2. 变量提升

• 使用var声明的变量存在变量提升的现象，即变量可以在声明之前使用，但值为undefined。
• 使用let声明的变量不存在变量提升，即在声明之前使用会报错。

示例2：

// ES5
function example3() {
  console.log(a); // 输出 undefined
  var a = 1;
  console.log(a); // 输出 1
}
example3();

// ES6
function example4() {
  console.log(b); // 报错：b is not defined
  let b = 2;
  console.log(b); // 不会执行
}
example4();

在示例3中，使用var声明的变量a在第一个console.log(a)语句中可以访问到，但值为undefined，因为变量提升导致a在声明之前已经存在，只是还未赋值。在第二个console.log(a)语句中，a的值为1，因为此时a已经被赋值为1。

而在示例4中，使用let声明的变量b在第一个console.log(b)语句中无法访问到，会报错，因为b不存在变量提升。所以第二个console.log(b)语句也不会执行。

结论

• 使用let关键字可以更好地控制变量的作用域，避免了变量提升带来的问题。
• 在ES6中，推荐使用let关键字来声明变量，而不是使用var关键字。

以上是关于\"ES6 关键字 let 和 ES5 及关键字 var 的区别解析\"的完整攻略，希望对你有帮助！