隨著 JavaScript 的不斷演進，ECMAScript 2015（簡稱 ES6）作為 JavaScript 的一次重大更新，帶來了許多新特性和語法改進，極大地提升了開發體驗和代碼質量。本文將詳細介紹 ES6 的主要新特性，并展示如何在實際項目中應用這些新語法。
一、let 和 const
在 ES6 之前，JavaScript 只有 var 關鍵字用于聲明變量。ES6 引入了 let 和 const 關鍵字，提供了更靈活和安全的變量聲明方式。
1.1 let
let 聲明的變量有塊級作用域，且不會提升。
if (true) {let x = 10;
}
console.log(x); // ReferenceError: x is not defined
1.2 const
const 聲明一個只讀的常量，必須在聲明時初始化。
const y = 20;
y = 30; // TypeError: Assignment to constant variable.
二、箭頭函數
箭頭函數提供了一種更簡潔的函數定義方式，并且不綁定自己的 this 值。
const add = (a, b) => a + b;
console.log(add(2, 3)); // 5
三、模板字符串
模板字符串使用反引號（``）包裹，可以嵌入變量和表達式，提供了更方便的字符串拼接方式。
const name = 'John';
const greeting = `Hello, ${name}!`;
console.log(greeting); // Hello, John!
四、解構賦值
解構賦值允許從數組或對象中提取值，并將其賦值給變量。
4.1 數組解構
const [a, b] = [1, 2];
console.log(a); // 1
console.log(b); // 2
4.2 對象解構
const {name, age} = {name: 'Alice', age: 25};
console.log(name); // Alice
console.log(age); // 25
五、默認參數
默認參數允許為函數的參數提供默認值，從而避免 undefined 的出現。
function multiply(a, b = 1) {return a * b;
}
console.log(multiply(5)); // 5
console.log(multiply(5, 2)); // 10
六、擴展運算符
擴展運算符（...）用于展開數組或對象。
6.1 數組展開
const arr1 = [1, 2, 3];
const arr2 = [...arr1, 4, 5];
console.log(arr2); // [1, 2, 3, 4, 5]
6.2 對象展開
const obj1 = {a: 1, b: 2};
const obj2 = {...obj1, c: 3};
console.log(obj2); // {a: 1, b: 2, c: 3}
七、類
ES6 引入了類（class）語法，使得面向對象編程更為簡潔和清晰。
class Person {constructor(name, age) {this.name = name;this.age = age;}greet() {console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);}
}const person = new Person('Bob', 30);
person.greet(); // Hello, my name is Bob and I am 30 years old.
八、模塊
ES6 引入了模塊系統，使得代碼的組織和復用更加方便。
8.1 導出模塊
// math.js
export const add = (a, b) => a + b;
export const subtract = (a, b) => a - b;
8.2 導入模塊
// main.js
import { add, subtract } from './math.js';console.log(add(5, 3)); // 8
console.log(subtract(5, 3)); // 2
結語
ES6 帶來了許多令人興奮的新特性，使得 JavaScript 變得更加強大和易用。通過掌握這些新語法，開發者可以編寫出更簡潔、高效和可維護的代碼。
