Introduction to ES6ES6 简介：JavaScript 的新特性

欢迎学习 ECMAScript 6 (ES6) 的介绍课程！通过本视频，你将能够：

• 定义 ECMAScript 6（简称 ES6）
• 描述 ES6 新增的 JavaScript 特性及其应用方法

---

什么是 ECMAScript？

• ECMAScript (ES) 是 JavaScript 的标准规范。
• ECMA 是一家制定全球信息和通信技术标准的组织。
• JavaScript 遵循 ECMA 规范，其中 ES6 于 2015 年发布。
• 新版本命名规则：
  • 新版本以发布年份命名（如：ECMAScript 2020）。
  • ES.Next 是动态名称，表示未来的 ECMAScript 版本。

---

ES6 关键新增特性

ES6 为 JavaScript 引入了一些具有重大影响的特性，包括：

---

1.let 和 const

在 JavaScript 中，我们通常使用 var 来声明变量，但 var 有一个全局作用域，意味着一旦声明，变量可以在代码的任何地方被使用。这在处理大型项目时特别具有挑战性。

ES6 引入了 let 和 const，这两者提供了更严格的作用域控制：

• let 允许在块级作用域内声明变量，这种作用域被称为 局部作用域。
  • 例如，num 仅在特定的块内有效，若在块外访问，程序将报错。
• const 用于声明常量，其值不可修改。
  • 例如，若尝试修改已声明为常量的变量，程序将抛出错误。

---

2.箭头函数 (Arrow Functions)

箭头函数是一种简化函数声明的方式，使用这种语法能更简洁、清晰地编写函数。

传统 ES5 函数声明

function sayHello() {
    console.log("Hello!");
}

ES6 箭头函数声明

const sayHello = () => console.log("Hello!");

• 箭头函数的语法非常简洁，且可以直接返回值。
• 如果函数没有参数，可以省略圆括号；如果只有一行代码，且该行代码是返回值，也可以省略大括号。

箭头函数的特点

1. 单参数简化：

• 参数可以省略括号。
• 例如：

  const double = x => x * 2;
  

2. 多参数需要括号：

• 示例：

  const add = (a, b) => a + b;
  

3. 多行代码需要花括号：

• 示例：
  

  const multiply = (a, b) => { const result = a * b; return result; };
  

4. 回调函数：

• 箭头函数可以作为参数传递：
  

  setTimeout(() => console.log("Timeout!"), 1000);
  

3.Promise 对象

Promise 状态

示例：创建 Promise

let myPromise = new Promise((resolve, reject) => {
    let currentTime = new Date().getMilliseconds();
    if (currentTime % 2 === 0) {
        resolve("Success!");
    } else {
        reject("Failed!");
    }
});

myPromise
    .then(result => console.log(result))
    .catch(error => console.log(error));

4.Class 类的引入

Class 是 ES6 中引入的一个重要特性，它为 JavaScript 提供了面向对象编程的能力。Class 是创建对象的模板或蓝图，它构建在 原型链 的基础上。

类的声明与构造函数

class Rectangle {
    constructor(height, width) {
        this.height = height;
        this.width = width;
    }

    area() {
        return this.height * this.width;
    }
}

let myRectangle = new Rectangle(5, 10);
console.log(myRectangle.area()); // 输出 50

类的继承

在 ES6 中，可以通过 extends 关键字实现类的继承。子类会继承父类的所有属性和方法。

class Square extends Rectangle {
    constructor(side) {
        super(side, side);  // 调用父类构造函数
    }
}

let mySquare = new Square(5);
console.log(mySquare.area()); // 输出 25

总结

通过本视频，你学习了以下 ES6 引入的关键特性：

• let 和 const：提供更严格的作用域控制，减少错误。
• 箭头函数：使函数声明更加简洁，且支持更清晰的回调处理。
• Promise：用于处理异步操作，简化异步编程。
• Class：引入面向对象编程（OOP）的概念，支持继承、构造函数等功能。

这些新特性大大提高了 JavaScript 编程的效率和可维护性，帮助开发者构建更可靠、结构化的代码。