网站首页 > 资源文章 正文
看最近这么多人看这个,大致更新下,不太全,详细的自己可以去查
ES6
ES6中的Map 和Object的区别
- 由于对象只接受字符串作为键名,所以element被自动转为字符串[object HTMLDivElement]
- ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。 也就是说,Object 结构提供了“字符串—值”的对应, Map 结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。
最常遇到的就是箭头函数 面试的时候问的最多 箭头函数和this 指向
https://es6.ruanyifeng.com/ https://www.cnblogs.com/theblogs/p/10575845.html
ES6 兼容问题
ES7
ES7在ES6的基础上添加三项内容:求幂运算符(**)、Array.prototype.includes()方法、函数作用域中严格模式的变更。 幂运算:
3**2 // 9
includes:
[1, 2, 3].indexOf(3) > -1 // true
等同于:
[1, 2, 3].includes(3) // true
两者这都是通过===进行数据处理,但是对NaN数值的处理行为不同。includes对NaN的处理不会遵循严格模式去处理,所以返回true。indexOf会按照严格模式去处理,返回-1。
[1, 2, NaN].includes(NaN) // true
[1, 2, NaN].indexOf(NaN) // -1
如果仅仅查找数据是否在数组中,建议使用includes,如果是查找数据的索引位置,建议使用indexOf更好一些
ES8
async、await异步解决方案
在ES6中为了解决回调的书写方式,引入了Promise的then函数,业务逻辑很多的时候,需要链式多个then函数,语义会变得很不清楚。
new Promise((resolve, reject) => {this.login(resolve)})
.then(() => this.getInfo())
.then(() => {// do something})
.catch(() => { console.log("Error") })
ES8中把async和await变得更加方便,它其实就是Generator的语法糖。async/await是写异步代码的新方式,以前的方法有回调函数和Promise。相比于Promise,它更加简洁,并且处理错误、条件语句、获取中间值都更加方便。 ruanyifeng async
Object.entries():
该方法会将某个对象的可枚举属性与值按照二维数组的方式返回。(如果目标对象是数组,则会将数组的下标作为键值返回)
Object.values():
它的工作原理和Object.entries()方法很像,但是它只返回键值对中的值,结果是一维数组
Object.values({one: 1, two: 2}) // [1, 2]
Object.values({3: 'a', 1: 'b', 2: 'c'}) // ['b', 'c', 'a']
Object.extries([1, 3]) //[1, 3]
字符串填充padStart()、padEnd():
ES8提供了新的字符串填充方法,该方法可以使得字符串达到固定长度。它有两个参数,字符串目标长度和填充内容。
'react'.padStart(10, 'm') //'mmmmmreact'
'react'.padEnd(10, 'm') //' reactmmmmm'
'react'.padStart(3, 'm') // "react"
ES10
Array的flat()方法和flatMap()
flat() 方法会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回
- flat()方法最基本的作用就是数组降维;
- 还可以利用flat()方法的特性来去除数组的空项
扁平化多维数组:
var arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]
//使用 Infinity 作为深度,展开任意深度的嵌套数组
arr3.flat(Infinity);
// [1, 2, 3, 4, 5, 6]
//去除空项
var arr4 = [1, 2, , 4, 5];
arr4.flat();
// [1, 2, 4, 5]
flatMap() 方法首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。 它与 map 和 深度值1的 flat 几乎相同,但 flatMap 通常在合并成一种方法的效率稍微高一些。 这里我们拿map方法与flatMap方法做一个比较
var arr1 = [1, 2, 3, 4];
arr1.map(x => [x * 2]);
// [[2], [4], [6], [8]]
arr1.flatMap(x => [x * 2]);
// [2, 4, 6, 8]
// 只会将 flatMap 中的函数返回的数组 “压平” 一层
arr1.flatMap(x => [[x * 2]]);
// [[2], [4], [6], [8]]
String的trimStart()方法和trimEnd()方法 Object.fromEntries() Symbol.prototype.description String.prototype.matchAll Function.prototype.toString()现在返回精确字符,包括空格和注释 简化try {} catch {},修改 catch 绑定 新的基本数据类型BigInt globalThis import() Legacy RegEx 私有的实例方法和访问器
猜你喜欢
- 2024-11-24 重磅!H110主板成为5代元老?竟然点亮了LGA1200的i3 10300ES?
- 2024-11-24 JavaScript语法 ES6、ES7、ES8、ES9、ES10、ES11、ES12新特性汇总
- 2024-11-24 盘点一些有意思的ES版处理器
- 2024-11-24 14nm将成绝唱:英特尔明年推出Rocket Lake-S
- 2024-11-24 ES6、ES7、ES8、ES9、ES10常用语法总汇
- 2024-11-24 当白菜价遇上白菜价,高性价比ES是否仍值得购买?
- 2024-11-24 雷克萨斯ES改装10.25寸屏幕后有怎么的体验?
- 2024-11-24 2010年11月雷克萨斯ES240豪华版
- 2024-11-24 十分钟上手 ES 2020 新特性
- 2024-11-24 不用加价买雷克萨斯ES了!这款10万的国产车外形和它有一拼?
你 发表评论:
欢迎- 05-21外贸人必备8个效率外贸工具合集
- 05-21Dify实战:解除Dify知识库上传文件15MB限制的
- 05-21腾讯云国际站:怎样优化TCP传输效率?
- 05-21电脑文件怎么压缩
- 05-21手机扩容新方案,搭配腾隐P2000移动固态硬盘,还可以在再战几年
- 05-21如何安全的传输文件(2)
- 05-21前端大文件秒传黑科技!程序员集体沸腾
- 05-21128GB内存8060S最强核显!极摩客EVO-X2 Max+ 395开箱
- 最近发表
- 标签列表
-
- 电脑显示器花屏 (79)
- 403 forbidden (65)
- linux怎么查看系统版本 (54)
- 补码运算 (63)
- 缓存服务器 (61)
- 定时重启 (59)
- plsql developer (73)
- 对话框打开时命令无法执行 (61)
- excel数据透视表 (72)
- oracle认证 (56)
- 网页不能复制 (84)
- photoshop外挂滤镜 (58)
- 网页无法复制粘贴 (55)
- vmware workstation 7 1 3 (78)
- jdk 64位下载 (65)
- phpstudy 2013 (66)
- 卡通形象生成 (55)
- psd模板免费下载 (67)
- shift (58)
- localhost打不开 (58)
- 检测代理服务器设置 (55)
- frequency (66)
- indesign教程 (55)
- 运行命令大全 (61)
- ping exe (64)
本文暂时没有评论,来添加一个吧(●'◡'●)