news 2026/8/29 4:12:22

ES6新增了哪些新特性

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
ES6新增了哪些新特性

1.let/const 声明变量(彻底替代 var)

解决var变量提升、没有块级作用域、可重复声明三大问题,是 ES6 最基础也是最必须的特性。

  • let:声明可变的块级作用域变量,不可重复声明,无变量提升(暂时性死区);
  • const:声明不可变的块级作用域常量,必须初始化,不可重复声明,注意:引用类型(对象 / 数组)的内容可修改,只是指向的地址不可变
// var的问题 var a = 1; var a = 2; // 可重复声明,无报错 if (true) { var a = 3; } console.log(a); // 3,无块级作用域,全局覆盖 // let/const的正确用法 let b = 1; // let b = 2; // 报错:Identifier 'b' has already been declared if (true) { let b = 3; console.log(b); } // 3,块级作用域内有效 console.log(b); // 1,不受块内影响 const PI = 3.14; // PI = 3.1415; // 报错:Assignment to constant variable const obj = { name: 'ES6' }; obj.name = 'JavaScript'; // 正常,引用类型内容可修改

2.箭头函数(=>)(简化函数写法)

简化函数定义,同时解决this 指向混乱的问题(箭头函数没有自己的 this,其 this 继承自外层作用域的 this)。

  • 语法(参数) => { 函数体 },单参数可省略(),单行返回可省略{}return
  • 注意:不能作为构造函数(不能 new),没有 arguments 对象,不能用 yield(不能作生成器)。
// 普通函数 vs 箭头函数 const add = function(a, b) { return a + b; }; const add = (a, b) => a + b; // 简化:多参数+单行返回 const fn = a => a * 2; // 单参数省略() const say = () => { console.log('Hello ES6'); }; // 无参数需() // 解决this指向问题(经典场景:定时器/回调函数) const person = { name: 'Tom', sayHi: function() { // 普通函数:this指向调用者person setTimeout(() => { // 箭头函数:this继承自外层sayHi的this,即person console.log(`Hi, I'm ${this.name}`); // Hi, I'm Tom }, 1000); } }; person.sayHi();

使用场景:回调函数(定时器、数组方法、Promise)、简单函数,避免在对象方法、构造函数中使用

3.解构赋值(★★★★★,快速提取数据)

快速从数组 / 对象中提取值,赋值给变量,简化繁琐的取值代码,开发中高频用于接口数据解析、函数参数传值。

  • 数组解构:按顺序提取,支持默认值、剩余参数;
  • 对象解构:按属性名提取,支持重命名、默认值、剩余参数。
// 数组解构 const [a, b, c] = [1, 2, 3]; console.log(a, b, c); // 1 2 3 const [x, , y] = [4, 5, 6]; // 跳过第二个元素 const [m, n = 10] = [7]; // 默认值:n=10 const [first, ...rest] = [1,2,3,4]; // 剩余参数:rest=[2,3,4] // 对象解构(开发高频) const user = { name: 'Alice', age: 20, gender: 'female' }; const { name, age } = user; // 按属性名提取 console.log(name, age); // Alice 20 const { name: uname, gender = 'male' } = user; // 重命名+默认值 const { ...info } = user; // 剩余参数:info={name,age,gender} // 实战场景:接口数据解析 const res = { code: 200, data: { list: [1,2,3], total: 3 }, msg: 'success' }; const { data: { list, total } } = res; // 嵌套解构 c
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/8/24 10:50:55

vue.3

1.局部注册只能在注册的组件内使用(1)创建vue文件(2)在使用的组件内导入并注册2.全局注册所有组件内都能使用(1)创建vue文件(2)main.js中进行全局注册3.组件的样式冲突scoped全局注册…

作者头像 李华
网站建设 2026/8/27 15:25:37

centos7-nvidia驱动安装及简单测试

centos7-nvidia驱动安装类别信息服务器型号Rack Mount Chassis NF5280M6CPUIntel Xeon Silver 4310 CPU 2.10GHz * 2系统版本Centos 7系统内核版本3.10.0-1160.el7.x86_64GPU型号NVIDIA A100(40G)*4Nvidia版本525.85.05CUDA版本12.0.0docker版本20.10.9…

作者头像 李华
网站建设 2026/8/27 4:29:39

BUCK-BOOST升降压电路Multisim电路仿真分析

目录 0 概述 工作过程简述 Q1 导通阶段 Q1 关断阶段 稳态输出 主要元件作用 电路特点 1 过程分析: 第一次开关闭合时 第二次Q1闭合时C1放电 2 Multisim仿真分析 占空比D=25% 占空比D=60% 摘要 本文分析了三极管型BUCK-BOOST升降压开关电源的工作原理。该电路结…

作者头像 李华
网站建设 2026/8/18 20:08:26

内存固态等大幅涨价的优势是什么?

原本电子垃圾又有了些许价值升华。 排名上升 现在有部分旧电脑重新启用。看大数据的排名结果: https://blog.csdn.net/ZhangRelay/article/details/155345614 这是去年,2025年11月28日测试的结果,2%排位,非常低端了。 预料之中的…

作者头像 李华
网站建设 2026/8/24 6:18:23

YOLOv12官版镜像训练全流程,附完整代码示例

YOLOv12官版镜像训练全流程,附完整代码示例 YOLOv12不是迭代编号的简单延续,而是一次范式跃迁——它彻底告别了卷积主干,将注意力机制作为目标检测的原生语言。当行业还在为RT-DETR的推理延迟发愁时,YOLOv12已用1.6毫秒完成一次高…

作者头像 李华