ES13

版本记录

版本介绍

来源：https://262.ecma-international.org/13.0/#sec-intro

ECMAScript 2022, the 13th edition, introduced top-level await, allowing the keyword to be used at the top level of modules; new class elements: public and private instance fields, public and private static fields, private instance methods and accessors, and private static methods and accessors; static blocks inside classes, to perform per-class evaluation initialization; the #x in obj syntax, to test for presence of private fields on objects; regular expression match indices via the /d flag, which provides start and end indices for matched substrings; the cause property on Error objects, which can be used to record a causation chain in errors; the at method for Strings, Arrays, and TypedArrays, which allows relative indexing; and Object.hasOwn, a convenient alternative to Object.prototype.hasOwnProperty.

版本概要

版本特性

`.at()`

Array.prototype.at()

at() 方法接收一个整数值并返回该索引对应的元素，允许正数和负数。负整数从数组中的最后一个元素开始倒数。

const array1 = [5, 12, 8, 130, 44]

let index = 2

console.log(`An index of ${index} returns ${array1.at(index)}`)
// Expected output: "An index of 2 returns 8"

index = -2

console.log(`An index of ${index} returns ${array1.at(index)}`)
// Expected output: "An index of -2 returns 130"

String.prototype.at()

at() 方法接受一个整数值，并返回一个新的 String，该字符串由位于指定偏移量处的单个 UTF-16 码元组成。该方法允许正整数和负整数。负整数从字符串中的最后一个字符开始倒数。

const sentence = 'The quick brown fox jumps over the lazy dog.'

let index = 5

console.log(`An index of ${index} returns the character ${sentence.at(index)}`)
// Expected output: "An index of 5 returns the character u"

index = -4

console.log(`An index of ${index} returns the character ${sentence.at(index)}`)
// Expected output: "An index of -4 returns the character d"

顶层 await

await 操作符用于等待一个 Promise 兑现并获取它兑现之后的值。它只能在异步函数或者模块顶层中使用。

在模块的顶层，你可以单独使用关键字 await（异步函数的外面）。也就是说一个模块如果包含用了 await 的子模块，该模块就会等待该子模块，这一过程并不会阻塞其他子模块。

下面是一个在 export 表达式中使用了 Fetch API 的例子。任何文件只要导入这个模块，后面的代码就会等待，直到 fetch 完成。

// fetch request
const colors = fetch('../data/colors.json').then((response) => response.json())

export default await colors

类

class field

class MyClass {
  // 构造函数
  constructor() {
    // 构造函数体
  }

  // 实例字段
  myField = 'foo'

  // 实例方法
  myMethod() {
    // myMethod 体
  }

  // 静态字段
  static myStaticField = 'bar'

  // 静态方法
  static myStaticMethod() {
    // myStaticMethod 体
  }

  // 静态块
  static {
    // 静态初始化代码
  }

  // 字段、方法、静态字段、静态方法、静态块都可以使用私有形式
  #myPrivateField = 'bar'
}

Object.prototype.hasOwnProperty()

hasOwnProperty() 方法返回一个布尔值，表示对象自有属性（而不是继承来的属性）中是否具有指定的属性。

Object.hasOwn()`(es13)`

如果指定的对象自身有指定的属性，则静态方法 Object.hasOwn() 返回 true。如果属性是继承的或者不存在，该方法返回 false。

const object1 = {
  prop: 'exists',
}

console.log(Object.hasOwn(object1, 'prop'))
// Expected output: true

console.log(Object.hasOwn(object1, 'toString'))
// Expected output: false

console.log(Object.hasOwn(object1, 'undeclaredPropertyValue'))
// Expected output: false

Object.prototype.hasOwnProperty()`(old)`

备注：在支持 Object.hasOwn 的浏览器中，建议使用 Object.hasOwn()，而非 hasOwnProperty()。

const object1 = {}
object1.property1 = 42

console.log(object1.hasOwnProperty('property1'))
// Expected output: true

console.log(object1.hasOwnProperty('toString'))
// Expected output: false

console.log(object1.hasOwnProperty('hasOwnProperty'))
// Expected output: false

正则`.indices`和`d`修饰符

在 ES13 之前，正则表达式的匹配结果主要提供了匹配的文本和捕获组的信息，但对于复杂情况，这些信息可能不足。Match Indices 特性的引入，为开发者提供了更丰富的匹配结果信息。

Match Indices 特性在处理需要精确位置信息的字符串匹配时非常有用。

例如，在文本编辑器中搜索和替换特定模式的文本时，可以利用 Match Indices 特性来精确定位和替换匹配的文本。

`d`修饰符

所有正则修饰符

ES13 通过新增d 修饰符，向匹配结果添加一个属性.indices。

`.indices`属性

.indices 属性是一个索引数组，其中包含每个捕获的子字符串的一对开始索引和结束索引。这些索引值表示匹配结果在原始字符串中的位置。

开发者可以通过索引直接访问捕获结果，同时利用.indices 属性获取第 n 个组的开始和结束索引。

记录的值是一个左闭右开的区间，即[开始索引, 结束索引)。

const re = /a+(?<Z>z)?/d
const str = 'aaaz'
const match = str.match(re)

if (match) {
  console.log(match[0]) // 匹配的文本 "aaaz"
  console.log(match.indices[0]) // [0, 4] 表示匹配文本在原始字符串中的位置
  // 如果有捕获组，可以通过 match.indices[n]（n为捕获组的索引）来获取捕获组的索引信息
}

ES13 ​

版本记录 ​

版本介绍 ​

版本概要 ​

版本特性 ​

.at() ​

Array.prototype.at() ​

String.prototype.at() ​

顶层 await ​

类 ​

Object.prototype.hasOwnProperty() ​

Object.hasOwn()(es13) ​

Object.prototype.hasOwnProperty()(old) ​

正则.indices和d修饰符 ​

d修饰符 ​

.indices属性 ​