ES2023新特性你知多少
前端面试题包括ECMScript,TypeScript,Nodejs,React,Webgl,Webpack,Threejs等还在整理中,在线地址前端面试题,源码地址大家多多支持才有动力给大家分享更多好的面试题。
- ES2023(也叫 ECMAScript 2023 或 ES14)带来了一些新的语言特性和改进,进一步增强了 javascript 的功能和灵活性。
Array.prototype.toSorte()
- toSorted() 方法是不可变的,它返回一个已排序好的数组副本,而不会个修改原数组,与 Array.prototype.sort() 不同的是,sort 是原地排序,会改变原数组。
const arr = [3, 1, 4, 1, 5];
const sortedArr = arr.toSorted(); // 原数组arr不变
console.log(sortedArr);
Array.prototype.toSpliced
- toSpliced()方法用于返回一个经过裁剪的新数组副本,而不改变原数组,它是 Array.proto.splice 的不可变版本。
const arr = [1, 2, 3, 4];
const splicedArr = arr.toSpliced(1, 2); // 从索引 1 开始删除 2 个元素s
console.log(splicedArr);
Array.prototype.width
- width() 方法用于创建一个要改特定索引值的新数组,而不改变原数组。
const arr = [1, 2, 3];
const newArr = arr.width(1, 10); // 修改索引1的值为10
console.log(newArr); // [1,10,3];
console.log(arr); // [1,2,3];// 原数组未变
Array.prototype.findLast()和 Array.prototype.findLastIndex()
- findLast():从数组未尾开始遍历,返回第一个满足条件的元素。
- findLastIndex():从数组未发开始遍历,返回第一个满足条件的元素的索引。
// findLast
const arr = [1, 2, 3, 4, 5];
const lastEven = arr.findLast((n) => n % 2 === 0);
console.log(lastEven); // 4// findLastIndex
const lastEvenIndex = arr.findLastIndex((n) => n % 2 === 0);
console.log(lastEvenIndex);
Symbol.prototype.description 的可变性
- Symbol.prototype.description 现在是可选的,允许更灵活地创建 Symbol,Symbol 可以没有描述符。
const sym = Symbol();
console.log(sm.description); // underfinedconst symWithDesc = Symbol('description');
console.log(symWithDesc.description); // 'description'
Object.hasOwn
- Object.hasOwn() 是 Object.prototype.hashOwnProperty 的简化版本,专门用于检查对像是否拥有某个属性。
const obj = { foo: 123 };
console.log(Object.hasOwn(obj, 'foo'));
console.log(Object.hasOwn(obj, 'bar'));
WeakMap 和 WeakSet 中的 WeakRef
- ES2023 进一步增强了弱引用的功能,允许开发者通过 WeakRef 引用一个对像,而不影响该对像的垃圾回收,FinalizationRegistry 也可以帮助在对像被拉圾回收时执行回调。
let target = { name: 'example' };
const waakRef = new WeakRef(target);console.log(waakRef.deref());target = null;
Promise.widthResolvers
- ES2023 新增的Promise.withResolvers() 用于创建一个包含resolve和reject方法的对像,并返回与之关联的Promise对像,这在某此场景中使用更容易创建和控制Promise。
const { promise, resolve, reject } = Promise.withResolvers();setTimeout(() => resolve('Done!'), 1000);promise.then(result => console.log(result)); // 1秒后输出 "Done!"
总结
- ES2023 继承推动 JavaScript 的现代码,带来了更多不可变数据处理的方法,增强了数组操作的灵活性,同时提供了对 WeakRef 和 Promise 的改进。这些特性有助于编写更简洁、安全和高效的代码,特别是在涉及复杂数据处理或异步任务时。