ES6、ES7、ES8、ES9、ES10.png
看最近这么多人看这个，大致更新下，不太全，详细的自己可以去查
另外付一下自己大厂面试的简单记录，给需要小伙伴
大厂面试记录
ES6
ES6中的Map 和Object的区别
-
由于
对象只接受字符串作为键名，所以element被自动转为字符串[object HTMLDivElement] -
ES6 提供了 Map 数据结构。它类似于对象，也是键值对的集合，
但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。
也就是说，Object 结构提供了“字符串—值”的对应，
Map 结构提供了“值—值”的对应，是一种更完善的 Hash 结构实现。
image.png
最常遇到的就是箭头函数
面试的时候问的最多
箭头函数和this 指向
https://es6.ruanyifeng.com/
https://www.cnblogs.com/theblogs/p/10575845.html
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()方法的特性来去除数组的空项
扁平化多维数组：
image.png
image.png
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
私有的实例方法和访问器
网友评论