ES6+ Cheatsheet - ES6+ JavaScript Syntax Reference
ES6+ 现代 JavaScript 开发必备语法都在这里了，从模块化到异步编程，按类别分类整理，写代码时直接复制。
Back to Languages变量与函数 9
let x = 1块级作用域变量
const PI = 3.14块级作用域常量
const fn = (x) => x * 2箭头函数
const fn = (x, y = 1) => x + y默认参数
const fn = (...args) => args剩余参数
fn(...[1, 2, 3])展开运算符
user?.name可选链（null/undefined 时短路）
value ?? "default"空值合并（仅 null/undefined 时取默认值）
`Hello ${name}`模板字符串插值
解构赋值 5
const [a, b] = [1, 2]数组解构
const { name, age } = user对象解构
const { name: userName } = user解构重命名
const [a, ...rest] = [1, 2, 3]解构+剩余
function fn({ name, age = 18 }) {}函数参数解构
异步编程 8
new Promise((resolve, reject) => {})创建 Promise
promise.then().catch().finally()链式调用
Promise.all([p1, p2])并行执行所有
Promise.race([p1, p2])取最快完成的
async function fn() { await promise }async/await
try { await fn() } catch (e) {}错误处理
Promise.allSettled([p1, p2])所有完成（不论成功失败）
Promise.any([p1, p2])取第一个成功的
模块化 6
export const fn = () => {}命名导出
export default fn默认导出
import { fn } from "./module"命名导入
import fn from "./module"默认导入
import * as mod from "./module"导入所有
import("./module").then(mod => {})动态导入
类与数据结构 8
class User { constructor() {} }类定义
class Admin extends User {}继承
const map = new Map()Map（键可以是对象）
const set = new Set([1, 2, 3])Set（去重）
for (const [k, v] of map) {}遍历 Map
Array.from(set)Set 转数组
Symbol("id")唯一标识符
for (const item of iterable) {}迭代器协议
Proxy/Reflect 与 Generator 8
new Proxy(target, handler)创建代理对象拦截操作
handler.get(target, key, receiver)拦截属性读取
handler.set(target, key, value)拦截属性设置
Reflect.get(obj, key)反射 API（转发默认行为）
function* gen() { yield 1; yield 2; }生成器函数
const it = gen(); it.next(); it.next()手动迭代生成器
for (const v of gen()) {}用 for...of 消费生成器
const wm = new WeakMap()WeakMap（键必须为对象，弱引用）
💡 Tips
- const 声明的对象/数组内容仍可修改，只是引用不可变。
- 箭头函数没有自己的 this，继承外层作用域。
- async/await 是 Promise 的语法糖，错误用 try/catch 捕获。
- ?. 和 ?? 是 ES2020 特性，?. 短路返回 undefined，?? 仅在 null/undefined 时触发。
- Proxy 常用于响应式系统（如 Vue 3 reactive），Reflect 提供对应的默认行为转发。
- Generator 函数执行到 yield 暂停并返回值，调用 next() 恢复执行。
- WeakMap/WeakSet 的键是弱引用，不影响垃圾回收，适合缓存场景。