javascript的ES6是什么_带来了哪些新特性【教程】-js教程-PHP中文网

ES6是JavaScript语言规范的重大正式发布，涵盖语法、数据结构、异步模型和模块系统；推荐用let/const替代var，箭头函数无独立this，解构赋值显式表达接口契约，Map/Set提供真·数据结构能力。

javascript的es6是什么_带来了哪些新特性【教程】

ES6 是 ECMAScript 2015 标准的俗称，不是“升级版 JavaScript”，而是 JavaScript 语言规范的一次重大正式发布——它从语法、数据结构、异步模型到模块系统，全面补足了早期 JS 的短板。你写 const、用 =>、解构对象、import 模块，其实都在用 ES6。

let 和 const 怎么选？别再用 var 了

绝大多数场景下，var 应该被完全弃用。它带来的变量提升和函数作用域混乱，是很多 ReferenceError 或意外覆盖的根源。

let：用于会重新赋值的变量，比如循环计数器、临时状态——有块级作用域，不提升，重复声明直接报错
const：用于不打算重新赋值的变量，包括对象和数组——注意：它只锁定“绑定”，不冻结内容；const obj = {}; obj.name = 'a'; 合法，但 obj = {}; 会报 TypeError: Assignment to constant variable.
常见坑：for (var i = 0; i console.log(i), 0); 输出三个 3；换成 let i 就输出 0, 1, 2

箭头函数（`=>`）什么时候不能用？

它不是 function 的简单缩写，核心差异在于没有自己的 this、arguments、super 或 new.target——所有这些都继承自外层非箭头函数作用域。

适合：回调（如 array.map((x) => x * 2)）、事件处理器、简化短函数
不能用：对象方法定义（{ fn: () => this.x } 中 this 指向外层，不是当前对象）、构造函数（new (() => {}) 报错）、需要动态 this 的 Vue/React 方法
典型错误：document.addEventListener('click', () => this.handleClick()) —— 如果 this 期望指向组件实例，这里会是 window 或 undefined（严格模式）

解构赋值不只是“写得少”，它是接口契约的显式表达

解构不是炫技，而是把“我需要什么字段”提前声明清楚，尤其在函数参数和 API 响应处理中极为实用。

react-modernization

将 React 应用升级到最新版本，从类组件迁移到 Hooks，并采用并发特性。用于现代化改造 React 代码库、迁移到 React Hooks 或升级到最新

下载

函数参数解构 + 默认值：function connect({ host = 'localhost', port = 3000 } = {}) { ... } —— 调用时可传空对象或部分字段，避免一堆 options.host || 'localhost'
嵌套解构要谨慎：const { data: { user: { name } } } = response; 若 response.data 为 null，直接报错；可用可选链 response?.data?.user?.name 配合解构，或先校验
数组解构跳过元素：const [first, , third] = ['a', 'b', 'c']; 得到 first='a', third='c'；但别为了跳过而牺牲可读性

Map 和 Set 是真·替代方案，不是语法糖

它们解决了原生对象和数组无法优雅处理的问题：对象键只能是字符串/Symbol，数组查找是 O(n)。而 Map 和 Set 是专门设计的数据结构。

Map 的 key 可以是任意类型：const m = new Map(); m.set({}, 'value'); m.set(document.body, 'DOM node'); —— 这在缓存、状态映射等场景不可替代
Set 去重比 [...new Set(arr)] 更语义清晰，且支持对象去重（Array.from(new Set([{id:1}, {id:1}])) 不去重，因为对象引用不同；但 Set 本身不比较内容，这点常被误解
性能提示：对大量数据做存在判断（has），Map.has(key) 是 O(1)，比 arr.includes(item)（O(n)）快得多