您当前的位置:首页 > 电脑百科 > 软件技术 > 软件技术

20个不容错过的ES6技巧

时间:2022-05-05 10:42:03  来源:  作者:Mason程

1. 打乱数组顺序

20个不容错过的ES6技巧

 

code1.png

2. 去除数字之外的所有字符

20个不容错过的ES6技巧

 

code20.png

3. 反转字符串或者单词

20个不容错过的ES6技巧

 

code2.png

4. 将十进制转换为二进制或十六进制

20个不容错过的ES6技巧

 

code3.png

5. 合并多个对象

20个不容错过的ES6技巧

 

code4.png

6.===和==的区别

20个不容错过的ES6技巧

 

code5.png

7. 解构赋值

20个不容错过的ES6技巧

 

code6.png

8. 交换变量的值

20个不容错过的ES6技巧

 

code7.png

9-1. 判断回文字符串

20个不容错过的ES6技巧

 

code21.png

回文字符串: 正着写和反着写都一样的字符串 (特别感谢@浮生阁阁主[1]勘误)

9-2 判断两个字符串是否为互相排列

20个不容错过的ES6技巧

 

code8.png

判断两个字符串是否为互相排列: 给定两个字符串,一个是否是另一个的排列

10. 可选链操作符

20个不容错过的ES6技巧

 

code9.png

MDN: 可选链操作符( ?. )允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。?. 操作符的功能类似于 . 链式操作符,不同之处在于,在引用为空(nullish ) (null 或者 undefined) 的情况下不会引起错误,该表达式短路返回值是 undefined。与函数调用一起使用时,如果给定的函数不存在,则返回 undefined

例如:

if (res && res.data && res.data.success) {   
   //code
} 
复制代码

相当于:

if (res?.data?.success) {
  // code
}
复制代码

11. 三目运算符

20个不容错过的ES6技巧

 

code10.png

12. 从数组中随机选择一个值

20个不容错过的ES6技巧

 

code11.png

13. 冻结对象

20个不容错过的ES6技巧

 

code12.png

14. 删除数组重复的元素

20个不容错过的ES6技巧

 

code13.png

15. 保留指定位小数

20个不容错过的ES6技巧

 

code14.png

16. 清空数组

20个不容错过的ES6技巧

 

code15.png

17. 从RGB转换为HEX

20个不容错过的ES6技巧

 

code16.png

18. 从数组中获取最大值和最小值

20个不容错过的ES6技巧

 

code17.png

19. 空值合并运算符

20个不容错过的ES6技巧

 

code18.png

MDN: 空值合并操作符(??)是一个逻辑操作符,当左侧的操作数为 null 或者 undefined 时,返回其右侧操作数,否则返回左侧操作数。

20. 过滤数组中值为false的值

20个不容错过的ES6技巧

 

code19.png



Tags:ES6   点击:()  评论:()
声明:本站部分内容及图片来自互联网,转载是出于传递更多信息之目的,内容观点仅代表作者本人,不构成投资建议。投资者据此操作,风险自担。如有任何标注错误或版权侵犯请与我们联系,我们将及时更正、删除。
▌相关推荐
八种常见的 JavaScript ES6 使用技巧
我们一起来分析一下八种常见的 JavaScript ES6 使用技巧都有哪些。1.添加对象属性值给对象添加属性,名称动态变化怎么办?let obj = {};let index = 1;let key = `topic${index...【详细内容】
2023-05-29  Search: ES6  点击:(302)  评论:(0)  加入收藏
前端开发常用的ES6语法,建议收藏!
1. 啥是 ES6? 在学习 ES6 之前,我们先了解一下啥是 ES。ES 全称 ECMAScript,它是由欧洲计算机协会(ECMA)制定的一种脚本语言的标准化规范。这家伙说白了就是给 JavaScript 制...【详细内容】
2023-03-16  Search: ES6  点击:(129)  评论:(0)  加入收藏
ES6 真的比ES5好很多吗?
不吹不捧,5和6做个对比,ES6及以上版本是由多个功能组成的,这是一个多维度的比较,不能简单抽象成6比5好。为了兼容老的浏览器,尤其是IE系列,使用ES6以上规范的前端代码往往使用Bab...【详细内容】
2022-12-09  Search: ES6  点击:(304)  评论:(0)  加入收藏
20个不容错过的ES6技巧
1. 打乱数组顺序 code1.png2. 去除数字之外的所有字符 code20.png3. 反转字符串或者单词 code2.png4. 将十进制转换为二进制或十六进制 code3.png5. 合并多个对象 code4.png...【详细内容】
2022-05-05  Search: ES6  点击:(216)  评论:(0)  加入收藏
ES6、ES7、ES8、ES9、ES10常用语法总汇
学习了一段时间的前端知识,日常中会copy些语法使用规则,对于这些语法虽会简单的使用,但并不咋了解,因此决定对这些进行了一番系统的学习:一.声明变量现在JavaScript有三种不同关...【详细内容】
2020-12-17  Search: ES6  点击:(559)  评论:(0)  加入收藏
前端程序员不可不知的ES6干货知识点
ES6是什么,为什么要学习它,不学习ES6会怎么样?答:ES6是新一代的JS语言标准,对分JS语言核心内容做了升级优化,规范了JS使用标准,新增了JS原生方法,使得JS使用更加规范,更加优雅,更适...【详细内容】
2020-09-16  Search: ES6  点击:(292)  评论:(0)  加入收藏
ES6-proxy和Reflect以及vue3.0的响应式
vue3.0中把响应式改成了proxy替代了以前的Object.defineProperty的形式;vue3.0的包目录截图; 其中:compiler-core:编译器核心compiler-dom:针对浏览器的编译模块compiler-ssr:针对...【详细内容】
2020-07-05  Search: ES6  点击:(457)  评论:(0)  加入收藏
全球新能源车1-5月榜单:除了特斯拉Model 3,广汽Aion S、蔚来ES6也值得关注
根据EV Sales公布的数据显示,2020年5月,全球共售出14.5万辆新能源乘用车,相比4月11.03万辆的销量,环比上涨31.1%,比2019年同期下降19.3%,但下滑幅度有所收窄。2020年1-5月,全球新能...【详细内容】
2020-07-04  Search: ES6  点击:(464)  评论:(0)  加入收藏
es6中Array.from()和数组去重
Array.from()1.复制数组,如果传的是数组,将把数组复制一份传给新数组。let arr = [1,2,3,4,5];let arr2 = Array.from(arr);console.log(arr) // [1,2,3,4,5]console.log(arr2...【详细内容】
2019-08-14  Search: ES6  点击:(1215)  评论:(0)  加入收藏
▌简易百科推荐
如何在Windows 10中查看电脑的名称?这里提供详细步骤
你想在有多台计算机组成的网络上查找你的计算机吗?一种方法是找到你的电脑名称,然后在网络上匹配该名称。下面是如何在Windows 10中使用图形和命令行方法查看你的计算机名称。...【详细内容】
2024-04-10  驾驭信息纵横科技    Tags:Windows 10   点击:(6)  评论:(0)  加入收藏
移动版 Outlook 解锁新技能,可验证登录 OneDrive 等微软服务
IT之家 4 月 9 日消息,微软公司近日发布新闻稿,宣布用户可以使用 Outlook 手机应用,轻松登录 Teams、OneDrive、Microsoft 365 以及 Windows 等微软账号服务。移动端 Outlook...【详细内容】
2024-04-09    IT之家  Tags:Outlook   点击:(7)  评论:(0)  加入收藏
Win10/Win11和 macOS用户反馈:谷歌云服务“捆绑”系统 DNS 设置
IT之家 4 月 6 日消息,谷歌公司承认旗下的 Google One 订阅服务中存在问题,在 Windows 10、Windows 11 以及 macOS 系统上会更改系统 DNS 设置,变更为 8.8.8.8 地址。Google On...【详细内容】
2024-04-08    IT之家  Tags:Win10   点击:(11)  评论:(0)  加入收藏
电脑卡顿怎么重装系统,快看这篇
电脑卡顿时,重装系统确实是一种可能的解决方案。以下是重装系统的详细步骤:备份重要数据:首先,你需要将电脑中的重要文件和数据备份到外部存储设备(如U盘、移动硬盘或云存储)中,以...【详细内容】
2024-04-04  科技数码前锋    Tags:重装系统   点击:(4)  评论:(0)  加入收藏
如何检查电脑的最近历史记录?这里提供详细步骤
如果你怀疑有人在使用你的计算机,并且你想查看他们在做什么,下面是如何查看是否有访问内容的痕迹。如何检查我的计算机的最近历史记录要检查计算机的最近历史记录,应该从web浏...【详细内容】
2024-03-30  驾驭信息纵横科技    Tags:历史记录   点击:(6)  评论:(0)  加入收藏
关于Windows中AppData的相关知识,看这篇文章就可以了
如果AppData文件夹占用了你电脑上的太多空间,则需要清理AppData文件夹。下面是一些帮助你在Windows计算机上进行AppData清理的方法。什么是AppData文件夹AppData文件夹是保存...【详细内容】
2024-03-30  驾驭信息纵横科技    Tags:AppData   点击:(10)  评论:(0)  加入收藏
微软 Edge 浏览器将迎来“内存限制器”功能,用户可自主控制 Edge 内存占用
IT之家 3 月 28 日消息,微软即将为其 Edge 浏览器带来一项实用新功能,据悉该公司正在测试一项内置的内存限制器,这项功能可以让用户限制 Edge 所占用的内存,防止浏览器超出内存...【详细内容】
2024-03-29    IT之家  Tags:Edge   点击:(21)  评论:(0)  加入收藏
一寸照片的大小如何压缩?四个实测效果很好的方法
一寸照片作为生活中常见的尺寸之一,常用于各类证件照与证明文件的制作。然而,受限于其较为狭小的尺寸,上传及打印过程中很容易出现尺寸超限的情况。所以,这个时候就需要对其体积...【详细内容】
2024-03-18  宠物小阿涛    Tags:压缩   点击:(20)  评论:(0)  加入收藏
手机投屏到电脑/电视的方法
方法一:Win10自带的投影功能1、将手机和电脑连接同一个无线网络。2、选择【开始】>【设置】>【系统】>【投影到此电脑】3、将默认的始终关闭的选项更改为所有位置都可用。4、...【详细内容】
2024-03-18    老吴讲I  Tags:投屏   点击:(20)  评论:(0)  加入收藏
微软商店怎么卸载应用 一分钟快速看懂!
微软商店怎么卸载应用 一分钟快速看懂!微软公司(Microsoft Corporation)是一家全球领先的科技企业,总部位于美国华盛顿州的雷德蒙德。成立于1975年,由比尔·盖茨和保罗&mid...【详细内容】
2024-02-27  婷婷说体育    Tags:微软商店   点击:(42)  评论:(0)  加入收藏
站内最新
站内热门
站内头条