ES6 中变量声明关键词详解-JavaScript中文网-JavaScript教程资源分享门户

ES6 是 ECMAScript 的第六个版本，也被称为 ECMAScript 2015。在这个版本中，JavaScript 新增了一些变量声明关键词，包括 let、const 和 class。这些关键词对于前端开发者来说是非常重要的，因为它们可以帮助我们更好地管理变量和代码。

let 关键词

let 关键词用于声明块级作用域的变量。块级作用域是指在花括号 {} 中定义的作用域。与 var 不同，let 声明的变量只在花括号内部可见，外部无法访问。

{
  let x = 10;
  console.log(x); // 10
}
console.log(x); // Uncaught ReferenceError: x is not defined

在 for 循环中使用 let 关键词可以避免一些常见的问题。在使用 var 关键词时，我们通常需要使用闭包来保存变量的值，否则在循环中使用的变量会被覆盖。而使用 let 关键词则可以避免这个问题。

for (let i = 0; i < 5; i++) {
  setTimeout(function() {
    console.log(i);
  }, 1000);
}

上面的代码会输出 0、1、2、3、4，而不是 5 个 4。

const 关键词

const 关键词用于声明常量。与 let 不同，const 声明的变量不能被重新赋值。

const PI = 3.141592653589793;
PI = 3; // Uncaught TypeError: Assignment to constant variable.

const 声明的变量必须在声明时就被赋值，否则会报错。

const PI; // Uncaught SyntaxError: Missing initializer in const declaration

const 声明的常量是块级作用域的，与 let 类似。

class 关键词

class 关键词用于定义类。类是一种面向对象编程的概念，它可以用来创建对象。类中包含属性和方法，可以通过实例化类来访问这些属性和方法。

// javascriptcn.com 代码示例
class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  sayHello() {
    console.log(`Hello, my name is ${this.name}`);
  }
}

const person = new Person('Alice', 20);
person.sayHello(); // Hello, my name is Alice

在上面的代码中，我们定义了一个名为 Person 的类，它有两个属性 name 和 age，以及一个方法 sayHello。我们通过实例化类来创建一个名为 person 的对象，并调用了 sayHello 方法。

总结

ES6 中的 let、const 和 class 关键词是前端开发者必须掌握的知识点。它们可以帮助我们更好地管理变量和代码，避免一些常见的问题。在实际开发中，我们应该根据需要选择合适的关键词来声明变量和定义类。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/6512616d95b1f8cacdad91a3