ES6 常用的方法和语法

ES6（ECMAScript 2015）引入了许多新的语法和方法，使 JavaScript 代码更简洁、可读性更高，功能更强大。以下是 ES6 常用的方法和语法：

---

1. 变量声明

• let：块级作用域变量
• const：块级作用域常量

let a = 10;
const b = 20;

---

2. 模板字符串

使用反引号 （backticks），支持多行字符串和变量插值。

const name = "桃子小姐";
console.log(`你好，${name}！`);

---

3. 箭头函数

简化函数声明，并自动绑定 this。

const sum = (a, b) => a + b;
console.log(sum(2, 3)); // 5

---

4. 对象解构 & 数组解构

• 对象解构

const person = { name: "桃子小姐", age: 27 };
const { name, age } = person;
console.log(name, age);

• 数组解构

const arr = [1, 2, 3];
const [first, second] = arr;
console.log(first, second);

---

5. 默认参数

为函数参数提供默认值。

const greet = (name = "游客") => `你好, ${name}!`;
console.log(greet()); // 你好, 游客!

---

6. 展开运算符（…）

用于数组、对象的展开。

• 数组展开

const arr1 = [1, 2, 3];
const arr2 = [...arr1, 4, 5];
console.log(arr2); // [1, 2, 3, 4, 5]

• 对象展开

const obj1 = { a: 1, b: 2 };
const obj2 = { ...obj1, c: 3 };
console.log(obj2); // { a: 1, b: 2, c: 3 }

---

7. for...of 循环

用于遍历可迭代对象，如数组、字符串等。

const arr = ["苹果", "香蕉", "橘子"];
for (const fruit of arr) {
  console.log(fruit);
}

---

8. Map 和 Set

• Map（键值对）

const map = new Map();
map.set("name", "桃子小姐");
console.log(map.get("name")); // 桃子小姐

• Set（去重集合）

const set = new Set([1, 2, 3, 3, 4]);
console.log(set); // Set { 1, 2, 3, 4 }

---

9. Promise

用于处理异步操作。

const fetchData = () => {
  return new Promise((resolve, reject) => {
    setTimeout(() => resolve("数据加载成功"), 1000);
  });
};

fetchData().then(console.log);

---

10. async/await

简化 Promise 的使用。

const fetchData = async () => {
  return "数据加载成功";
};

const getData = async () => {
  const data = await fetchData();
  console.log(data);
};

getData();

---

11. 类（Class）

ES6 提供了 class 关键字来定义类。

class Person {
  constructor(name) {
    this.name = name;
  }
  greet() {
    console.log(`你好, 我是${this.name}`);
  }
}

const person = new Person("桃子小姐");
person.greet();

---

12. 模块化（import/export）

ES6 允许使用 import 和 export 进行模块化管理。

• 导出

export const name = "桃子小姐";
export const sayHello = () => console.log("你好！");

• 导入

import { name, sayHello } from "./module.js";
console.log(name);
sayHello();

---