17370845950

ES6是JavaScript第6版标准（ECMAScript 2015），补齐语法、对象模型与异步能力；let/const提供块级作用域与赋值约束；箭头函数简化this但无自身this/arguments；解构与模板字符串提升可读性；Promise与async/await解决回调地狱。

ES6 不是新语言，而是 JavaScript 的第 6 版语言标准（正式名称是 ECMAScript 2015），它从语法、对象模型到异步处理都补上了长期缺失的关键能力。浏览器和 Node.js 现在已全面支持，直接用就行，不用编译（除非要兼容 IE）。

let / const 替代 var：作用域和赋值约束更清晰

var 的函数作用域和变量提升常导致意外交互；let 和 const 改为块级作用域，且不提升，更符合直觉。

• let 声明的变量可重新赋值，但不能重复声明（同一作用域内）
• const 声明的必须初始化，且绑定不可重赋值——注意：对象或数组本身可修改，只是引用不能变
• 循环中用 let 声明计数器，每次迭代都会生成新绑定，避免闭包陷阱

for (let i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 0); // 输出 0, 1, 2
}

箭头函数：简化 this 和写法，但有明确限制

() => {} 是函数简写，但它没有自己的 this、arguments、super 或 new.target，全部继承自外层作用域。

• 适合写回调、映射逻辑等无状态操作，比如 [1,2,3].map(x => x * 2)
• 不能用作构造函数：new (() => {}) 会抛 TypeError
• 不能使用 arguments 对象，需改用剩余参数 ...args
• 单参数且只有一条返回语句时可省括号和 return，如 x => x + 1

解构赋值与模板字符串：减少 boilerplate，提升可读性

从数组/对象中“抽值”和拼接字符串不再是繁琐的点取和加号连接。

• 对象解构支持别名：const { name: fullName, age } = user;
• 数组解构可跳过项：const [first, , third] = arr;
• 模板字符串用反引号，支持多行和插值：`Hello ${name}, you're ${age}`
• 注意：模板字符串中的换行会真实出现在输出里，不是语法糖里的空格

const user = { name: 'Alice', role: 'admin' };
const { name, role } = user;
console.log(`User: ${name}, Role: ${role}`); // User: Alice, Role: admin

Promises 和 async/await：让异步逻辑不再嵌套地狱

Promise 是 ES6 内置的异步抽象，async/await 是其语法糖（ES2017 引入，但依赖 ES6 的 Promise 基础）。

• Promise 必须用 .then() 和 .catch() 处理，链式调用天然避免回调嵌套
• async 函数自动返回 Promise，await 只能在 async 函数内使用
• await 后面如果不是 Promise，会自动包装成 resolved Promise
• 错误要用 try/catch 捕获，而不是 .catch() ——两者语义不同

async function fetchUser(id) {
  try {
    const res = await fetch(`/api/users/${id}`);
    return await res.json();
  } catch (err) {
    console.error('Fetch failed:', err);
  }
}

真正容易被忽略的是：解构默认值、模块导入导出的静态分析特性、以及 class 本质仍是原型继承——这些细节在重构旧代码或调试时经常成为隐性坑。别只记语法，得理解它们如何改变执行模型。