ES6 特性

ES6（ECMAScript 2015）引入了许多新特性，使得 JavaScript 更加现代化、简洁和强大。以下是一些常用的 ES6 特性：

1. let 和 const 声明变量

let 用于声明块级作用域的变量，避免了 var 可能引起的作用域问题。

const 用于声明常量，声明后无法重新赋值。

let x = 10; x = 20; // 允许修改 const y = 30; y = 40; // 错误，常量不可修改

2. 箭头函数 (=>)

箭头函数使函数的定义更加简洁，并且没有自己的 this，它会继承外部函数的 this。

const add = (a, b) => a + b; setTimeout(() => { console.log('Hello'); }, 1000);

3. 模板字符串（Template Literals）

使用反引号（`````）创建字符串，可以嵌入表达式和多行字符串。

let name = "Alice";
let greeting = `Hello, ${name}!`;
console.log(greeting); // "Hello, Alice!"

let multiLine = `This is
a multi-line
string.`;
console.log(multiLine);

4. 解构赋值（Destructuring）

可以将数组或对象的值解构到变量中，简化代码。

数组解构：

let [a, b] = [1, 2];
console.log(a, b); // 1 2

对象解构：

let {name, age} = {name: "John", age: 30};
console.log(name, age); // "John" 30

5. 默认参数（Default Parameters）

函数的参数可以设置默认值，当未传入参数时，使用默认值。

function greet(name = "Guest") {
  console.log(`Hello, ${name}!`);
}
greet(); // "Hello, Guest!"
greet("Alice"); // "Hello, Alice!"

6. 扩展运算符（Spread Operator）

用于展开数组或对象，或者将多个元素合并成一个新数组或对象。

数组扩展：

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

对象扩展：

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

7. 类（Class）

ES6 引入了面向对象编程的类（class）语法。

constructor是 构造器 构造对象

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.`);
  }
}

let person = new Person("Alice", 30);
person.greet(); 

8. Promise

Promise 用于处理异步操作，避免了回调地狱（callback hell）。

let promise = new Promise((resolve, reject) => {
  let success = true;
  if (success) {
    resolve("Data received");
  } else {
    reject("Error occurred");
  }
});

promise
  .then(data => console.log(data))  // "Data received"
  .catch(error => console.log(error));  // "Error occurred"

9. 模块化（Modules）

• ES6 引入了 import 和 export 语法，使得 JavaScript 更加模块化，方便代码分割和复用。

导出模块：

// math.js
export const add = (a, b) => a + b;
export const multiply = (a, b) => a * b;

导入模块：

// app.js
import { add, multiply } from './math.js';
console.log(add(1, 2));  // 3
console.log(multiply(2, 3));  // 6

10. 符号（Symbols）

Symbol 是一种新的原始数据类型，用于创建唯一的值，常用于对象属性的唯一标识。

let sym = Symbol("description");
let obj = {
  [sym]: "This is a symbol property"
};
console.log(obj[sym]); // "This is a symbol property"

11. 生成器（Generators）

生成器函数使用 function* 声明，并通过 yield 关键字返回值。生成器可以暂停和恢复执行，适合处理异步操作或大数据流。

function* generator() {
  yield 1;
  yield 2;
  yield 3;
}

let gen = generator();
console.log(gen.next().value); // 1
console.log(gen.next().value); // 2
console.log(gen.next().value); // 3

12. Set 和 Map

Set 是一个无重复元素的集合，Map 是一个键值对集合，可以用于更高效地存储和查找数据。

let set = new Set([1, 2, 3]);
set.add(4);
set.add(3);  // 不会添加重复元素
console.log(set); // Set { 1, 2, 3, 4 }

let map = new Map();
map.set("name", "Alice");
map.set("age", 30);
console.log(map.get("name")); // "Alice"
console.log(map.size); // 2

13. 异步函数（async / await）

async 和 await 用于简化异步操作，避免回调地狱。

async function fetchData() {
  let data = await fetch('https://api.example.com');
  let json = await data.json();
  console.log(json);
}

这些是 ES6 的一些常用特性，学习和掌握这些特性会帮助你编写更简洁、可维护和高效的 JavaScript 代码。