ECMAScript 2024 (ES15) 新特性更新

ECMAScript 2024 (ES15) 新特性更新

参阅tc39发布的文档:ECMAScript® 2025 Language Specification:

ECMAScript 2024, the 15th edition, added facilities for resizing and transferring ArrayBuffers and SharedArrayBuffers; added a new RegExp /v flag for creating RegExps with more advanced features for working with sets of strings; and introduced the Promise.withResolvers convenience method for constructing Promises, the Object.groupBy and Map.groupBy methods for aggregating data, the Atomics.waitAsync method for asynchronously waiting for a change to shared memory, and the String.prototype.isWellFormed and String.prototype.toWellFormed methods for checking and ensuring that strings contain only well-formed Unicode.

更新有下:

ArrayBuffer和SharedArrayBuffer新增可调整大小选项

正则表达式新增/v,用于创建具有更高级功能的正则表达式来处理字符串集合

Promise新增withResolvers来构建Promises

Object和Map新增groupBy用于聚合数据

Atomics新增waitAsync方法用于异步等待共享内存的更改

String新增isWellFormed和toWellFormed来检查和确保字符串仅包含正常的Unicode字符

特性一览

ArrayBuffer和SharedArrayBuffer

可调整大小的ArrayBuffer通过调用ArrayBuffer.prototype.resize()可以更改其字节长度。

js 复制代码
const buffer = new ArrayBuffer(8, { maxByteLength: 16 });

console.log(buffer.byteLength);
// Expected output: 8

buffer.resize(12);

console.log(buffer.byteLength);
// Expected output: 12

可调整大小的SharedArrayBuffer通过调用SharedArrayBuffer.prototype.grow()可以更改其字节长度。

js 复制代码
const buffer = new SharedArrayBuffer(8, { maxByteLength: 16 });

console.log(buffer.byteLength);

buffer.grow(12);

console.log(buffer.byteLength);

正则表达式新增/v

这种新模式新增了对扩展字符类的支持,包括以下功能:

  • 字符串的 Unicode 属性
  • 集合表示法+字符串文字语法
  • 匹配不区分大小写的语法
js 复制代码
// Unicode defines a character property named "Emoji".
const re1 = /^\p{Emoji}$/u;

// Match an emoji that consists of multiple code points:
re1.test('👨🏾‍⚕️'); // '\u{1F468}\u{1F3FE}\u200D\u2695\uFE0F'
// → false ❌

const re2 = /^\p{RGI_Emoji}$/v;

// Match an emoji that consists of multiple code points:
re2.test('👨🏾‍⚕️'); // '\u{1F468}\u{1F3FE}\u200D\u2695\uFE0F'
// → true ✅

Promise新增withResolvers

withResolvers的目的是简化从 Promise 中提取 resolvereject

js 复制代码
const { promise, resolve, reject } = Promise.withResolvers();

promise.then(res => {
  console.log(res)
})

let a = 10

if(a===10){
  resolve(10)
}else{
  reject(0)
}

Object和Map新增groupBy

用来给定可迭代对象中的元素进行分组。

js 复制代码
const inventory = [
  { name: "asparagus", type: "vegetables", quantity: 5 },
  { name: "bananas", type: "fruit", quantity: 0 },
  { name: "goat", type: "meat", quantity: 23 },
  { name: "cherries", type: "fruit", quantity: 5 },
  { name: "fish", type: "meat", quantity: 22 },
];

const result1 = Object.groupBy(inventory, ({ type }) => type);
/*
{
  vegetables: [ { name: 'asparagus', type: 'vegetables', quantity: 5 } ],
  fruit: [
    { name: 'bananas', type: 'fruit', quantity: 0 },
    { name: 'cherries', type: 'fruit', quantity: 5 }
  ],
  meat: [
    { name: 'goat', type: 'meat', quantity: 23 },
    { name: 'fish', type: 'meat', quantity: 22 }
  ]
}
*/

const result2 = Map.groupBy(inventory, ({ type }) => type);

/*
{
  'vegetables' => [ { name: 'asparagus', type: 'vegetables', quantity: 5 } ],
  'fruit' => [
    { name: 'bananas', type: 'fruit', quantity: 0 },
    { name: 'cherries', type: 'fruit', quantity: 5 }
  ],
  'meat' => [
    { name: 'goat', type: 'meat', quantity: 23 },
    { name: 'fish', type: 'meat', quantity: 22 }
  ]
}
*/

Atomics新增waitAsync

异步等待共享内存的特定位置并返回一个Promise,是非阻塞的且可用于主线程。

给定一个共享的 Int32Array。

js 复制代码
const sab = new SharedArrayBuffer(1024);
const int32 = new Int32Array(sab);

令一个读取线程休眠并在位置 0 处等待,预期该位置的值为 0。result.value 将是一个 promise。

js 复制代码
const result = Atomics.waitAsync(int32, 0, 0, 1000);
// { async: true, value: Promise {<pending>} }

在该读取线程或另一个线程中,对内存位置 0 调用以令该 promise 解决为 "ok"。

js 复制代码
Atomics.notify(int32, 0);
// { async: true, value: Promise {<fulfilled>: 'ok'} }

如果它没有解决为 "ok",则共享内存该位置的值不符合预期(value 将是 "not-equal" 而不是一个 promise)或已经超时(该 promise 将解决为 "time-out")。

String新增isWellFormed和toWellFormed

isWellFormed()返回一个表示该字符串是否包含单独代理项的布尔值。

js 复制代码
console.log("\uDFFFab".isWellFormed())
// false
console.log("abc".isWellFormed())
// true

toWellFormed() 方法返回一个字符串,其中该字符串的所有单独代理项都被替换为 Unicode 替换字符 U+FFFD。

js 复制代码
const strings = [
  // 单独的前导代理
  "ab\uD800",
  "ab\uD800c",
  // 单独的后尾代理
  "\uDFFFab",
  "c\uDFFFab",
  // 格式正确
  "abc",
  "ab\uD83D\uDE04c",
];

for (const str of strings) {
  console.log(str.toWellFormed());
}

// "ab�"
// "ab�c"
// "�ab"
// "c�ab"
// "abc"
// "ab😄c"
相关推荐
志尊宝4 小时前
Vue3 零基础每日笔记(005):ref 响应式基础——为什么 script 里要 .value
前端·javascript·vue.js·笔记
知兀5 小时前
框架脚手架搭建,推送github一键使用
javascript·vue.js·ecmascript
mayaairi6 小时前
Vue2 实战进阶:表单数据收集、指令系统与自定义指令全解析
前端·javascript·vue.js
图扑软件6 小时前
下篇・换墨|主题/多语言/移动端,一套组件全覆盖
前端·javascript·ui·性能优化·数据可视化
胖少年7 小时前
Vitest 5 正式发布实测:Node 22 起步、expect 内联、poll 超时会挂,3.8 亿月下载量的测试框架本周换代
javascript
雪芽蓝域zzs8 小时前
Vue3 defineProps` / `defineEmits` 是编译器宏,不需要手动 import 导入
前端·javascript·vue.js
whyweplay8 小时前
Elpis:从Json Schema 到 页面
前端·javascript
大牧师8 小时前
Nest.js 微服务入门教程
开发语言·javascript·后端·微服务·node.js·nest.js·nest
低代码布道师8 小时前
外包项目管理平台全栈实战课02搭建数据底座:Next.js + PostgreSQL + Prisma 7
开发语言·javascript·postgresql·全栈开发