百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

ES6 的新增语法

myzbx 2025-08-02 20:17 3 浏览

一、什么是 ES6 ?

ES 的全称是 ECMAScript , 它是由 ECMA 国际标准化组织,制定的一项脚本语言的标准化规范

ES6 实际上是一个泛指,泛指 ES2015 及后续的版本。

为什么使用 ES6 ?

每一次标准的诞生都意味着语言的完善,功能的加强。JavaScript语言本身也有一些令人不满意的地方。

  • 变量提升特性增加了程序运行时的不可预测性
  • 语法过于松散,实现相同的功能,不同的人可能会写出不同的代码

二、ES6 的新增语法

2.1 let

ES6中新增的用于声明变量的关键字。

  • let声明的变量只在所处于的块级有效

注意:使用let关键字声明的变量才具有块级作用域,使用var声明的变量不具备块级作用域特性。

  • 不存在变量提升

  • 暂时性死区



let

经典面试题

经典面试题图解:此题的关键点在于每次循环都会产生一个块级作用域,每个块级作用域中的变量都是不同的,函数执行时输出的是自己上一级(循环产生的块级作用域)作用域下的i值.

2.2 const

作用:声明常量,常量就是值(内存地址)不能变化的量。

  • 具有块级作用域



  • 声明常量时必须赋值
  • 常量赋值后,值不能修改。




2.3 let、const、var 的区别

1. 使用 var 声明的变量,其作用域为该语句所在的函数内,且存在变量提升现象

2. 使用 let 声明的变量,其作用域为该语句所在的代码块内,不存在变量提升

3. 使用 const 声明的是常量,在后面出现的代码中不能再修改该常量的值


2.4 解构赋值

ES6中允许从数组中提取值,按照对应位置,对变量赋值。对象也可以实现解构。

2.4.1 数组解构

如果解构不成功,变量的值为undefined。


按照一定模式,从数组中或对象中提取值,将提取出来的值赋值给另外的变量。

2.4.2 对象解构



2.5 箭头函数

ES6中新增的定义函数的方式。


函数体中只有一句代码,且代码的执行结果就是返回值,可以省略大括号


如果形参只有一个,可以省略小括号


箭头函数不绑定this关键字,箭头函数中的this,指向的是函数定义位置的上下文this。


2.6 剩余参数

剩余参数语法允许我们将一个不定数量的参数表示为一个数组。


剩余参数和解构配合使用


三、ES6 的内置对象扩展

3.1 Array 的扩展方法

扩展运算符(展开语法)

扩展运算符可以将数组或者对象转为用逗号分隔的参数序列。


扩展运算符可以应用于合并数组。



将类数组或可遍历对象转换为真正的数组


3.2 构造函数方法:Array.from()

将类数组或可遍历对象转换为真正的数组


方法还可以接受第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组。


3.2.1 实例方法:find()

用于找出第一个符合条件的数组成员,如果没有找到返回undefined


3.2.2 实例方法:findIndex()

用于找出第一个符合条件的数组成员的位置,如果没有找到返回-1


3.2.3 实例方法:includes()

表示某个数组是否包含给定的值,返回布尔值。


3.3 String 的扩展方法

模板字符串

ES6新增的创建字符串的方式,使用反引号定义。


模板字符串中可以解析变量。


模板字符串中可以换行

在模板字符串中可以调用函数。


3.3.1 实例方法:startsWith() 和 endsWith()

startsWith():表示参数字符串是否在原字符串的头部,返回布尔值

endsWith():表示参数字符串是否在原字符串的尾部,返回布尔值


3.3.2 实例方法:repeat()

repeat方法表示将原字符串重复n次,返回一个新字符串。


3.4 Set 数据结构


ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。

Set本身是一个构造函数,用来生成 Set 数据结构。


Set函数可以接受一个数组作为参数,用来初始化。


3.4.1 实例方法

  • add(value):添加某个值,返回 Set 结构本身
  • delete(value):删除某个值,返回一个布尔值,表示删除是否成功
  • has(value):返回一个布尔值,表示该值是否为 Set 的成员
  • clear():清除所有成员,没有返回值


3.5 遍历

Set 结构的实例与数组一样,也拥有forEach方法,用于对每个成员执行某种操作,没有返回值。


ES5 中的新增方法

相关推荐

重要提醒:一种常见药,千万不要掰开吃,严重可致休克!

前段时间,有报道称,福州40岁的张女士,在服用降压药时咬断药片,吃了大半片。不到半小时,她突然眼前发黑、冒冷汗、脚软站不住,差点发生危险。原来,张女士服用的这个药是硝苯地平控释片,1片相当于3...

Chinese FM spokesperson's remarks on Philippines' statement on 9th Anniversary of "2016 Arbitral Award on the South China Sea"

BEIJING,July12(Xinhua)--China'spositiononthe"2016ArbitralAwardontheSouthChinaSea"is...

三星S系列历年无线充电手机盘点,15W无线充电功率用了7年

前言三星S系列作为曾经的安卓机皇,各项配置都是顶级水准。但随着国产手机的技术实力越来越强,三星目前很多配置都谈不上顶尖了。其中,充电速度就是三星S系列的一大劣势点。充电头网下面就盘点一下三星S系列历年...

北汽幻速H6 S7 H2 S5 S3 S2 S6 H3 H5 S7维修手册电路图

2016-幻速H6-电路图2017-幻速S7-电路图2016-幻速H2V-电路图2015-幻速S5-电路2016-幻速H3F-电路2015-幻速H2E-电路2016-幻速S3L-电路2014-幻速S2...

GCV-3色谱检定仪 气相色谱仪检定装置 JJG700-2016规程铂电阻温度计

气相色谱仪作为现代分析实验室的核心设备,其性能的准确性直接关系到检测数据的可靠性。通量科技(南通)有限公司依据JJG700-2016《气相色谱仪检定规程》研发的整套气相色谱仪检定装置,通过标准物质与精...

特斯拉Model S电动车第三次改款,测试图曝光

IT之家5月22日消息,汽车媒体Drive今天(5月22日)发布博文,分享了一组在德国纽博格林赛道上抓拍到图片,展示了特斯拉新款ModelS。根据曝光的测试图片,特斯拉Mode...

土耳其F-16首次发射SOM-J巡航导弹,被F-35抛弃转投无人机

据海军新闻网站2025年3月24日报道,2025年3月21日,土耳其工业与技术部长宣布,由T"UBITAKSAGE研发的SOM-J(防区外弹药-J)巡航导弹在首次海上试射中成功命中目标。土耳其工业与...

毛细管黏度计检定装置-工作毛细管黏度计 满足JJG 155-2016规程

毛细管黏度计检定装置作为现代实验室中测量液体黏度的关键设备,其精度和可靠性直接影响石油、化工、医药等行业的质检结果。通量科技(南通)有限公司基于JJG155-2016规程研发的系列检定装置,通过技术...

盼星星盼月亮,理想ONE 1:18合金车模终于到了

正如标题所述,在跳票一个半月后,这台2020款理想ONE的1:18合金车模终于送到我们办公室。这款模型原定是今年6月中旬发货的,但不知道是什么原因,理想方面突然停止了发货,仅有很少一批用户得到了模型。...

“墙裂”推荐!越挫越勇的前端周刊(第五期)

前端周刊是一份专为前端从业人员,以及对前端、设计领域感兴趣的朋友们打造的技术周刊。程小狮会精选出前端、设计领域近期相关的资讯、热点以及技术干货,与大家一同分享。前端周刊专注于前端领域技术分享。希望这份...

JavaScript的Symbol,解决了多少你不知道的隐形大麻烦?

各位码农兄弟姐妹,以及对科技世界充满好奇的朋友们,大家好!你有没有在编写JavaScript代码时,遇到过一些让你头疼的“隐形”问题?比如,当你尝试往一个别人写的对象里添加新属性,结果不小心覆盖了原有...

2015款新尚酷9月接受预定 交家电大众实拍

大众新款尚酷在九月份南京已经开始销售,该车先期或只推出一款1.4T车型,售价为22.8万元。相比现款车型,新车对外观细节进行调整。尚酷Scirocco意思是撒哈拉吹向地中海的沙漠热风。是大众第一款全轮...

ES6 的新增语法

一、什么是ES6?ES的全称是ECMAScript,它是由ECMA国际标准化组织,制定的一项脚本语言的标准化规范。ES6实际上是一个泛指,泛指ES2015及后续的版本。为什么使用...

Excel宏(JSA)教程——初识Javascript

要想学好JSA,掌握好Javascript的是基础。那么什么是Javascript,这门编程语言有什么特征?今天我们就来聊一聊这些内容,让我们对Javascript有一个初步认识。发展历史1995年被...

ES6环境搭建及react-router学习

一、起因ES6新纳入了很多振奋人心的新特性,真的很让人忍不住去尝试一下。不过,由于现在大部分的浏览器对ES6的支持程度都不是很好。所以如果想要放心地使用一些新特性,还需要用一些工具,将ES6或者ES7...