大厂面试题分享 面试题库
前后端面试题库 (面试必备) 推荐:★★★★★
地址:前端面试题库 web前端面试题库 VS java后端面试题库大全
ES7
ES2016(ES7)中新增了如下特性👇
Array.prototype.includes
Exponentiation Operator
一、Array.prototype.includes
1.1 定义
includes()
方法用来判断一个数组或字符串中是否包含一个指定的值
返回值: 如果包含返回true
,否则返回false
。
1.2 语法
arr.includes(valueToFind)
arr.includes(valueToFind, fromIndex)
let arr = [1, 2, 3, 4]; arr.includes(3); // true arr.includes(5); // false arr.includes(3, 1); // true
1.2.1 fromIndex大于等于数组长度
返回false
arr.includes(3, 3); // false arr.includes(3, 20); // false
1.2.2 计算出的索引小于0
如果fromIndex
为负值,使用数组长度 + fromIndex
计算出的索引作为新的fromIndex
,如果新的fromIndex
为负值,则搜索整个数组。
arr.includes(3, -100); // true arr.includes(3, -1); // false
二、Exponentiation Operator
幂运算
幂运算符**
,相当于Math.pow()
5 ** 2 // 25 Math.pow(5, 2) // 25
ES8
ES2017(ES8)新增了以下特性👇
Async functions
Object.entries
Object.values
Object.getOwnPropertyDescriptors
Trailing commas
一、Async functions
1.1 定义
Async functions
是 async
声明的函数,async
函数是 AsyncFunction
构造函数的实例,其中允许使用 await
关键字。
1.2 语法
async function name([param[, param[, ...param]]]) { // statements }
1.3 返回值
一个Promise
1.4 例子
const promise = () => { console.log('1'); return new Promise((resolve, reject) => { resolve('2'); }); }; const asyncFun = async() => { console.log('3'); const test = await promise(); console.log('4', test); } asyncFun(); // 3 1 4 2
二、Object.entries
2.1 返回值
Object.entries()
方法返回一个给定对象自身可枚举属性的键值对数组
2.2 语法
Object.entries(obj);
2.3 例子
let obj = {a: 1, b: 2}; Object.entries(obj); // [['a', 1], ['b', 2]]
三、Object.values
3.1 返回值
Object.values()
方法返回一个给定对象自身可枚举属性值的数组
3.2 语法
Object.values(obj);
3.3 例子
let obj = {a: 1, b: 2}; Object.values(obj); // [1, 2]
四、Object.getOwnPropertyDescriptors
4.1 返回值
Object.getOwnPropertyDescriptors()
方法用来获取一个对象的所有自身属性的描述符
4.2 语法
Object.getOwnPropertyDescriptors(obj);
4.3 例子
let obj = {a: 1, b: 2}; Object.getOwnPropertyDescriptors(obj); // [a: {configurable: true, enumerable: true, value: 1, writable: true}, b: {configurable: true, enumerable: true, value: 2, writable: true}]
五、Trailing commas
尾后逗号
5.1 定义
如果你想要添加新的属性,并且在上一行已经使用了尾后逗号,你可以仅仅添加新的一行,而不需要修改上一行
5.2 注意
- JSON 不允许尾后逗号
5.3 举例
- 字面量中的尾后逗号
- 对象
let obj = { a: 1, b: 2 }
- 数组
let arr = [ 1, 2 ]
- 函数中的尾后逗号
- 参数定义
function(x, y) {} function(x, y,) {} (x, y) => {} (x, y,) => {}
- 函数调用
fun(x, y) fun(x, y,)
- 不合法的尾后逗号
不含参数或者在剩余参数后面加逗号,都是不合法的尾后逗号
function(,) {} (,) => {} fn(,) function(...arg,) {} (...arg,) => {}
- 解构中的尾后逗号
let [a, b,] = [1, 2]; let {x, y} = {x: 1, y: 2};
- JSON中的尾后逗号
JSON中不允许出现尾后逗号
JSON.parse("[1, 2, 3,]") // ❌ JSON.parse('{"a": 1,}') // ❌ JSON.parse("[1, 2, 3]") // ✅ JSON.parse('{"a": 1}') // ✅
六、String.prototype.padStart()
6.1 定义
padStart()
用另一个字符串填充当前字符串。
6.2 返回值
在原字符串开头填充指定的填充字符串直到目标长度所形成的新字符串。
6.3 语法
str.padStart(targetLength); str.padStart(targetLength, padString);
- targetLength:当前字符串需要填充到的目标长度。如果这个数值小于当前字符串的长度,则返回当前字符串本身。
- padString(可选):填充字符串。如果字符串太长,使填充后的字符串长度超过了目标长度,则只保留最左侧的部分,其他部分会被截断。此参数的默认值为 " "。
6.4 例子
'abc'.padStart(10); // " abc" 'abc'.padStart(10, "foo"); // "foofoofabc" 'abc'.padStart(6,"123465"); // "123abc" 'abc'.padStart(8, "0"); // "00000abc" 'abc'.padStart(1); // "abc"
七、String.prototype.padEnd()
7.1 定义
padEnd() 方法会用一个字符串填充当前字符串(如果需要的话则重复填充)。
7.2 返回值
返回在原字符串末尾填充指定的填充字符串直到目标长度所形成的新字符串。
7.3 语法
1. str.padEnd(targetLength) 2. str.padEnd(targetLength, padString)
- targetLength:当前字符串需要填充到的目标长度。如果这个数值小于当前字符串的长度,则返回当前字符串本身。
- padString(可选):填充字符串。如果字符串太长,使填充后的字符串长度超过了目标长度,则只保留最左侧的部分,其他部分会被截断。此参数的缺省值为 " "。
7.4 例子
'abc'.padEnd(10); // "abc " 'abc'.padEnd(10, "foo"); // "abcfoofoof" 'abc'.padEnd(6, "123456"); // "abc123" 'abc'.padEnd(1); // "abc"
ES9
ES2018(ES9)新增了如下特性👇
Async iterators
异步迭代器Object rest properties
剩余属性Object spread properties
扩展属性Promise.prototype.finally
一、Async iterators
异步迭代器
1.1 返回值
Async iterator
对象的 next() 方法返回一个 Promise
,这个 Promise
的返回值可以被解析成 {value, done}
的格式,
1.2 语法
iterator.next().then(({value, done}) => {});
1.3 举例
const asyncIterator = () => { const array = [1, 2]; return { next: function() { if(array.length) { return Promise.resolve({ value: array.shift(), done: false }); } return Promise.resolve({ done: true }); } } } let iterator = asyncIterator(); const test = async() => { await iterator.next().then(console.log); // {value: 1, done: false} await iterator.next().then(console.log); // {value: 2, done: false} await iterator.next().then(console.log); // {done: true} } test();
1.4 可以使用 for-await-of
在循环中异步调用函数
const promises = [ new Promise((resolve) => resolve(1)), new Promise((resolve) => resolve(2)), new Promise((resolve) => resolve(3)), ]; const test = async() => { for await (const p of promises) { console.log('p', p); } }; test();
二、Object rest properties
2.1 举例
let test = { a: 1, b: 2, c: 3, d: 4 } let {a, b, ...rest} = test; console.log(a); // 1 console.log(b); // 2 console.log(rest); // {c: 3, d: 4}
2.2 注意
null
不能使用扩展运算符
let {a, b, ...rest} = null; // ❌
三、Object spread properties
3.1 举例
let test = { a: 1, b: 2 } let result = {c: 3, ...test}; console.log(result); // {c: 3, a: 1, b: 2}
let test = null; let result = {c: 3, ...test}; // {c: 3}
四、Promise.prototype.finally
4.1 定义
在Promise
结束的时候,不管是结果是resolved
还是rejected
,都会调用finally
中的方法
finally
中的回调函数不接受任何参数
4.2 返回值
一个Promise
4.3 语法
const promise = new Promise((resolve, reject) => { resolve('resolved'); reject('rejectd'); }) promise.then((res) => { console.log(res); }).finally(() => { console.log('finally') });
4.4 举例
const promise = new Promise((resolve, reject) => { resolve(1); reject(2); }); const test = () => { console.log(3); promise.then((res) => { console.log(4, res); }).catch(err => { console.log(5, err); }).finally(() => { console.log(6); }); }; test(); // 3 4 1 6
ES10
ES2019(ES10)新增了如下新特性👇:
Array.prototype.{flat, flatMap}
扁平化嵌套数组Object.fromEntries
String.prototype.{trimStart, trimEnd}
Symbol.prototype.description
Optional catch binding
- Array.prototype.sort() is now required to be stable
一、Array.prototype.{flat, flatMap}
扁平化嵌套数组
1.1 Array.prototype.flat
1.1.1 定义
flat()
方法会按照一个可指定的深度遍历递归数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。
1.1.2 语法
arr.flat([depth]);
depth
是数组遍历的深度,默认是1。
1.1.3 返回值
一个新数组,不会改变旧数组。
1.1.4 举例
const arr = [1, 2, [[[[3, 4]]]]]; arr.flat(); // [1, 2, [[[3, 4]]]] arr.flat(3); // [1, 2, [3, 4]] arr.flat(-1); // [1, 2, [[[[3, 4]]]]] arr.flat(Infinity); // [1, 2, 3, 4]
1.1.5 注意
flat()
会移除数组中的空项
let arr = [1, 2, , , 3]; arr.flat(); // [1, 2, 3]
1.1.6 替换
reduce
与contact
let arr = [1, 2, [3, 4]]; arr.reduce((arr, val) => arr.concat(val), []);
...
扩展运算符与contact
let arr = [1, 2, [3, 4]]; [].contact(...arr);
ES7、ES8、ES9、ES10、ES11、ES12都增加了那些新特性?(二):https://developer.aliyun.com/article/1415028