关于javascript:ES2023来了深入解析JavaScript的最新更新

本文首发于微信公众号：大迁世界, 我的微信：qq449245884，我会第一工夫和你分享前端行业趋势，学习路径等等。
更多开源作品请看 GitHub https://github.com/qq449245884/xiaozhi，蕴含一线大厂面试残缺考点、材料以及我的系列文章。

快来收费体验 ChatGpt plus 版本的，咱们出的钱
体验地址:https://chat.waixingyun.cn
能够退出网站底部技术群，一起找 bug.

1. 从数组开端查找元素

这个函数容许咱们依据条件从数组的最初一个元素向前查找元素。例如：

const array = [{a: 1, b: 1}, {a: 2, b: 2}, {a: 3, b: 3}, {a: 4, b: 4}]

console.log(array.findLast(n => n)); //result -> {a: 4,b: 4}

console.log(array.findLast(n => n.a * 5 === 20)); // result -> {a:4,b:4} 

console.log(array.findLast(n => n.a * 5 === 21)); //result -> undefined 

console.log(array.findLastIndex(n => n.a * 5 === 21)); // result -> -1 

console.log(array.findLastIndex(n => n.a * 5 === 20)); // result -> 3

剖析：

const array = [{a: 1, b: 1}, {a: 2, b: 2}, {a: 3, b: 3}, {a: 4, b: 4}]
console.log(array.findLast(n => n)); // 后果 -> {a: 4,b: 4}

应用 findLast 办法从数组的开端开始查找第一个满足条件（n => n，即所有元素）的元素。因为所有元素都满足条件，所以它返回了数组的最初一个元素 {a: 4, b: 4}。

console.log(array.findLast(n => n.a * 5 === 20)); // 后果 -> {a:4,b:4}，因为条件为真，所以返回最初一个元素。

应用 findLast 办法从数组的开端开始查找第一个满足条件 （n => n.a * 5 === 20） 的元素。这个条件相当于在查找数组中 a 属性值为 4 的元素，所以它返回了 {a: 4, b: 4}。

console.log(array.findLast(n => n.a * 5 === 21)); // 后果 -> undefined，因为条件为假，所以返回 undefined，而不是 {a:4,b:4}。

应用 findLast 办法从数组的开端开始查找第一个满足条件 （n => n.a * 5 === 21） 的元素。因为数组中没有任何元素的 a 属性值能够满足这个条件，所以返回 undefined。

console.log(array.findLastIndex(n => n.a * 5 === 21)); // 后果 -> -1，因为条件不能为返回最初一个元素。

应用 findLastIndex 办法从数组的开端开始查找第一个满足条件（n => n.a * 5 === 21）的元素的索引。因为数组中没有任何元素的 a 属性值能够满足这个条件，所以返回 -1。

console.log(array.findLastIndex(n => n.a * 5 === 20)); // 后果 -> 3，这是最初一个元素的索引，因为条件为真。

应用 findLastIndex 办法从数组的开端开始查找第一个满足条件（n => n.a * 5 === 20）的元素的索引。这个条件相当于在查找数组中 a 属性值为 4 的元素的索引，所以它返回了 3，这是数组的最初一个元素的索引。

2.Hashbang 语法

这个个性使咱们可能在某些命令行接口中应用 Hashbang / Shebang。Shebang 用 #! 示意，是脚本开始的非凡行，通知操作系统执行脚本时应该应用哪个解释器。

#!/usr/bin/env node
// in the Script Goal
'use strict';
console.log(2*3);

#!/usr/bin/env node
// in the Module Goal
export {};
console.log(2*2);

#!/usr/bin/env node 这行代码将间接调用一个 Node.js 源文件，作为其本身的可执行文件。

咱们不须要应用这行代码 (#!/usr/bin/env node) 来显式地通过 Node 解释器调用文件，例如，node ./file。

3. 将 Symbols 作为 WeakMap 的键

这容许应用惟一的 Symbols 作为键。目前 WeakMaps 只容许对象作为键。因为它们共享同样的身份个性。

Symbol 是 ECMAScript 中惟一的原始类型，容许应用惟一的值，因而能够应用 Symbol 作为键，而不是创立一个新的带有 WeakMap 的对象。

const weak = new WeakMap();

const key = Symbol('my ref');
const someObject = {a:1};

weak.set(key, someObject);
console.log(weak.get(key));

4. 通过复制扭转数组

这在 Array.prototype 上提供了额定的办法，通过返回带有更改的新数组正本，而不是更新原始数组来更改数组。

新引入的 Array.prototype 函数包含：

1. Array.prototype.toReversed()
2. Array.prototype.toSorted(compareFn)
3. Array.prototype.toSpliced(start, deleteCount, …items)
4. Array.prototype.with(index, value)

事例

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9]

/* toReversed */
const reversed = numbers.toReversed();
console.log("reversed", reversed); // "reversed", [9, 8, 7, 6, 5, 4, 3, 2, 1]
console.log("original", numbers); // "original", [1, 2, 3, 4, 5, 6, 7, 8, 9]

这段代码应用了 toReversed 办法，该办法返回一个新数组，新数组的元素程序与原数组相同。咱们能够看到，原数组 numbers 并未被扭转。

/* toSorted  */
const sortedArr = numbers.toSorted();
console.log("sorted", sortedArr); // "sorted", [1, 2, 3, 4, 5, 6, 7, 8, 9]
console.log("original", numbers); // "original", [1, 2, 3, 4, 5, 6, 7, 8, 9]

这段代码应用了 toSorted 办法，该办法返回一个新数组，新数组的元素是原数组元素的排序后果。因为原数组曾经是排序的，所以新数组与原数组雷同。咱们能够看到，原数组 numbers 并未被扭转。

/* with */
const replaceWith = numbers.with(1, 100);
console.log("with", replaceWith); // "with", [1, 100, 3, 4, 5, 6, 7, 8, 9]
console.log("original", numbers); // "original", [1, 2, 3, 4, 5, 6, 7, 8, 9]

这段代码应用了 with 办法，该办法返回一个新数组，新数组在指定索引地位的元素被替换为指定值。咱们能够看到，新数组的第二个元素曾经被替换为 100，而原数组 numbers 并未被扭转。

/* toSpliced */
const splicedArr = numbers.toSpliced(0, 4);
console.log("toSpliced", splicedArr); // "toSpliced", [5, 6, 7, 8, 9]
console.log("original", numbers); // "original", [1, 2, 3, 4, 5, 6, 7, 8, 9]

这段代码应用了 toSpliced 办法，该办法返回一个新数组，新数组删除了原数组从指定地位开始的指定数量的元素。咱们能够看到，新数组删除了从地位 0 开始的 4 个元素，而原数组 numbers 并未被扭转。

这些都是 ES2023 行将推出的一些令人期待的新性能

代码部署后可能存在的 BUG 没法实时晓得，预先为了解决这些 BUG，花了大量的工夫进行 log 调试，这边顺便给大家举荐一个好用的 BUG 监控工具 Fundebug。

交换

有幻想，有干货，微信搜寻 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。

本文 GitHub https://github.com/qq449245884/xiaozhi 已收录，有一线大厂面试残缺考点、材料以及我的系列文章。