ES6（ES2015）有什么新特性？
2024年4月8日
在这篇文章你会知道
- ES6（ES2015）的 9 个重要新特性
在之前的文章《什么是 ECMAScript？与 JavaScript 有什么关系？》中，我们讨论了 ECMAScript 的角色，它是用来制定 JavaScript 新功能和语法的标准。
除此之外，也带到了 ES6（也称为 ES2015）是一个里程碑式的版本，引入了许多期待已久的语法糖和新特性。这些新增功能大大提升了开发者的编程体验和效率。
在本文中，我们将重点摆在介绍 ES6（ES2015） 的一些重要新特性。
ES6（ES2015）的 9 个重要新特性
1. let 和 const 关键字
ES6 引入了 let 和 const，提供了更好的变数声明方式。let 允许声明块级作用域变数，而 const 用于声明常数。
相关面试常考题
2. 箭头函式（Arrow Functions）
箭头函式提供了一种更简洁的函式写法，并自动绑定 this 关键字。
相关面试常考题
3. 样板字面值（Template Literals）
样板字面值是被反引号``所封闭，这种方式可以让字串的拼接更加方便，用法可以参考下方代码。
const name = "ExplainThis";
// 不用样板字面值（Template Literals）
console.log("Hello " + name + "!");
// 使用样板字面值（Template Literals）
console.log(`Hello ${name}!`);
4. 解构赋值（Destructuring Assignment）
解构赋值（Destructuring Assignment）语法是一种 JavaScript 运算式，可以从数组或物件中提取值，并将其赋给变数，用法可以参考下方代码。(MDN)
const obj = { product: "iphone", price: 20000 };
const { product, price } = obj;
console.log(product); // iphone
console.log(price); // 20000
const arr = ["iphone", 20000];
const [product, price] = arr;
console.log(product); // iphone
console.log(price); // 20000
5. 默认参数（Default Parameters）
默认参数（Default Parameters）也是现在在使用 JavaScript 上，很常使用到的方法。此语法可以为函式参数指定默认值，可以参考下方代码。
function add(a, b) {
return a + b;
}
// 在没有预设值的情况下
// 当参数没有传入值且函式内部没有其他判断
// 容易导致预期外的回传结果
console.log(add(1)); // NaN
// 透过默认参数，确保 a 和 b 有预设值
function add(a = 0, b = 0) {
return a + b;
}
console.log(add(1)); // 1
6. 展开运算符（Spread Operator）和其余参数（Rest Parameters）
展开运算符（Spread Operator）可以将数组或物件展开为个别元素; 而其余参数（Rest Parameters）则允许将多个参数收集为一个数组，可以参考下方代码。(展开运算符 MDN, 其余参数 MDN)
7. 类（Classes）
ES6 时引入了类（class）的概念，JavaScript 类（class）使用的语法，类似于其他 OOP 程式语言中的 class，但是本质上是一种语法糖，与其他程式语言的 class 实践方式并不一样，只是透过此语法糖可以用来模拟 class 的行为。
相关面试常考题
8. 模组化（Modules）
ES6 提供了官方的模组化支持，通过 import 和 export 关键字实现模组的导入和导出。
相关面试常考题
9. Promise
Promise 是一种处理异步操作的机制，可以避免回调地狱（callback hell），用来优化过去回调函式 callback 的写法。
相关面试常考题