update docs

.vitepress/nav.ts

@@ -2,6 +2,7 @@ import type { DefaultTheme } from 'vitepress'
 
 export const nav: DefaultTheme.NavItem[] = [
   { text: '首页', link: '/' },
+  { text: 'ECMAScript', link: '/ecmascript.html' },
   { text: 'JavaScript', link: '/javascript.html' },
   { text: 'TypeScript', link: '/typescript.html' },
   { text: '浏览器原理', link: '/browser.html' },

.vitepress/sidebar.ts

@@ -1,6 +1,14 @@
 import type { DefaultTheme } from 'vitepress'
 
 export const sidebar: DefaultTheme.Sidebar = {
+  '/ecmascript': [
+    {
+      text: 'ECMAScript',
+      items: [
+        { text: '2023', link: '/ecmascript/2023.html' },
+      ],
+    },
+  ],
   '/javascript': [
     {
       text: 'JavaScript',

src/docs/ecmascript.md

@@ -0,0 +1,5 @@
+---
+title: ECMAScript 特性
+---
+
+# ECMAScript 特性

src/docs/ecmascript/2023.md

@@ -0,0 +1,257 @@
+---
+title: ECMAScript 2023 特性
+---
+
+# ECMAScript 2023 特性
+
+## Array.prototype.toSorted()
+
+> TypedArray.prototype.toSorted()
+
+数组实例的 toSorted() 方法是 sort() 方法的复制版本。它返回一个新数组，其中的元素按升序排序。
+
+```javascript
+const months = ["Mar", "Jan", "Feb", "Dec"]
+const sortedMonths = months.toSorted()
+console.log(sortedMonths) // ['Dec', 'Feb', 'Jan', 'Mar']
+console.log(months) // ['Mar', 'Jan', 'Feb', 'Dec']
+
+const values = [1, 10, 21, 2]
+const sortedValues = values.toSorted((a, b) => a - b)
+console.log(sortedValues) // [1, 2, 10, 21]
+console.log(values) // [1, 10, 21, 2]
+```
+
+对于稀疏数组，空槽的排序方式就好像它们的值是未定义的一样。它们总是排序到数组的末尾，并且不会调用 compareFn。
+
+```javascript
+console.log(["a", "c", , "b"].toSorted()) // ['a', 'b', 'c', undefined]
+console.log([, undefined, "a", "b"].toSorted()) // ["a", "b", undefined, undefined]
+```
+
+对于非数组对象，toSorted() 方法会读取 this 的 length 属性。然后，它会收集范围在 0 到 length - 1 之间的所有现有整数键属性，对它们进行排序，并将它们写入一个新数组。
+
+```javascript
+const arrayLike = {
+  length: 3,
+  unrelated: "foo",
+  0: 5,
+  2: 4,
+  3: 3, // ignored by toSorted() since length is 3
+}
+console.log(Array.prototype.toSorted.call(arrayLike))
+// [4, 5, undefined]
+```
+
+## Array.prototype.toReversed()
+
+> TypedArray.prototype.toReversed()
+
+数组实例的 toReversed() 方法是 reverse() 方法的复制对应方法。它返回一个元素顺序颠倒的新数组。
+
+```javascript
+const items = [1, 2, 3]
+const reversedItems = items.toReversed()
+
+console.log(reversedItems) // [3, 2, 1]
+console.log(items) // [1, 2, 3]
+```
+
+对于稀疏数组，toReversed() 的返回值永远不会是稀疏的。空槽在返回的数组中将变为 undefined：
+
+```javascript
+console.log([1, , 3].toReversed()); // [3, undefined, 1]
+console.log([1, , 3, 4].toReversed()); // [4, 3, undefined, 1]
+```
+
+对于非数组对象，toReversed() 方法读取 this 的 length 属性。然后，它以降序访问具有 length - 1 和 0 之间整数键的每个属性，并将当前属性的值添加到要返回的数组末尾。
+
+```javascript
+const arrayLike = {
+  length: 3,
+  unrelated: "foo",
+  2: 4,
+}
+console.log(Array.prototype.toReversed.call(arrayLike))
+// [4, undefined, undefined]
+// '0' 和 '1' 索引不存在，因此它们变为 undefined
+```
+
+## Array.prototype.with()
+
+> TypedArray.prototype.with()
+
+数组实例的 with() 方法是使用括号符号更改给定索引值的复制版本。它会返回一个新数组，其中给定索引处的元素会被给定值替换。
+
+```javascript
+const arr = [1, 2, 3, 4, 5]
+console.log(arr.with(2, 6)) // [1, 2, 6, 4, 5]
+console.log(arr) // [1, 2, 3, 4, 5]
+```
+
+对于稀疏数组，with() 方法总是创建一个密集数组：
+
+```javascript
+const arr = [1, , 3, 4, , 6]
+console.log(arr.with(0, 2)) // [2, undefined, 3, 4, undefined, 6]
+```
+
+对于非数组对象，with() 方法创建并返回一个新数组。该方法读取 this 的 length 属性，然后访问键小于 length 的非负整数的每个属性。在访问 this 的每个属性时，索引等于属性键的数组元素会被设置为该属性的值。最后，索引处的数组值被设置为 value：
+
+```javascript
+const arrayLike = {
+  length: 3,
+  unrelated: "foo",
+  0: 5,
+  2: 4,
+  3: 3, // 由于 length 是 3，因此忽略了 with() 的索引
+};
+console.log(Array.prototype.with.call(arrayLike, 0, 1))
+// [ 1, undefined, 4 ]
+```
+
+## Array.prototype.findLast()
+
+> TypedArray.prototype.findLast()
+
+数组实例的 findLast() 方法按相反顺序遍历数组，并返回满足所提供测试函数的第一个元素的值。如果没有元素满足测试函数，则返回未定义值。
+
+```javascript
+const inventory = [
+  { name: "apples", quantity: 2 },
+  { name: "bananas", quantity: 0 },
+  { name: "fish", quantity: 1 },
+  { name: "cherries", quantity: 5 },
+]
+
+function isNotEnough(item) {
+  return item.quantity < 2
+}
+
+console.log(inventory.findLast(isNotEnough))
+// { name: "fish", quantity: 1 }
+```
+
+对于稀疏数组，稀疏数组中的空槽会被访问，其处理方式与未定义相同：
+
+```javascript
+// 声明索引为2、3和4的元素为空的数组
+const array = [0, 1, , , , 5, 6]
+
+// 显示所有索引，而不仅仅是那些分配了值的索引
+array.findLast((value, index) => {
+  console.log(`Visited index ${index} with value ${value}`);
+})
+// Visited index 6 with value 6
+// Visited index 5 with value 5
+// Visited index 4 with value undefined
+// Visited index 3 with value undefined
+// Visited index 2 with value undefined
+// Visited index 1 with value 1
+// Visited index 0 with value 0
+
+// 显示所有索引，包括已删除的
+array.findLast((value, index) => {
+  // 在第一次迭代时删除元素 5
+  if (index === 6) {
+    console.log(`Deleting array[5] with value ${array[5]}`)
+    delete array[5];
+  }
+  // 即使删除了元素5，元素5仍然被访问
+  console.log(`Visited index ${index} with value ${value}`)
+})
+// Deleting array[5] with value 5
+// Visited index 6 with value 6
+// Visited index 5 with value undefined
+// Visited index 4 with value undefined
+// Visited index 3 with value undefined
+// Visited index 2 with value undefined
+// Visited index 1 with value 1
+// Visited index 0 with value 0
+```
+
+对于非数组对象，findLast() 方法读取 this 的 length 属性，然后访问键值为小于 length 的非负整数的每个属性：
+
+```javascript
+const arrayLike = {
+  length: 3,
+  0: 2,
+  1: 7.3,
+  2: 4,
+  3: 3, // 由于长度为3，因此忽略了findLast（）
+}
+console.log(
+  Array.prototype.findLast.call(arrayLike, (x) => Number.isInteger(x)),
+) // 4
+```
+
+## Array.prototype.findLastIndex()
+
+> TypedArray.prototype.findLastIndex()
+
+和 Array.prototype.findLast() 类似，返回值是元素索引。
+
+## Array.prototype.toSpliced()
+
+数组实例的 toSpliced() 方法是 splice() 方法的复制版本。该方法会返回一个新数组，在给定索引处删除和/或替换了一些元素。
+
+```javascript
+const months = ["Jan", "Mar", "Apr", "May"]
+
+// 在索引 1 处插入一个元素
+const months2 = months.toSpliced(1, 0, "Feb")
+console.log(months2) // ["Jan", "Feb", "Mar", "Apr", "May"]
+
+// 从索引 2 开始删除两个元素
+const months3 = months2.toSpliced(2, 2)
+console.log(months3) // ["Jan", "Feb", "May"]
+
+// 用两个新元素替换索引 1 处的一个元素
+const months4 = months3.toSpliced(1, 1, "Feb", "Mar")
+console.log(months4) // ["Jan", "Feb", "Mar", "May"]
+
+// 原始数组没有被修改
+console.log(months) // ["Jan", "Mar", "Apr", "May"]
+```
+
+对于稀疏数组，toSpliced() 方法总是创建一个密集数组：
+
+```javascript
+const arr = [1, , 3, 4, , 6]
+console.log(arr.toSpliced(1, 2)) // [1, 4, undefined, 6]
+```
+
+对于非数组对象，toSpliced() 方法会读取 this 的长度属性。然后读取所需的整数键属性，并将它们写入新数组：
+
+```javascript
+const arrayLike = {
+  length: 3,
+  unrelated: "foo",
+  0: 5,
+  2: 4,
+}
+console.log(Array.prototype.toSpliced.call(arrayLike, 0, 1, 2, 3))
+// [2, 3, undefined, 4]
+```
+
+## Hashbang 注释
+
+hashbang 注释的行为与单行注释 (//) 完全相同，只是它以 #! 开头，并且只在脚本或模块的绝对起始处有效。还要注意的是，在 #!注释由 #！之后直到第一行末尾的所有字符组成；只允许有一个这样的注释。
+
+JavaScript 中的哈希邦注释类似于 Unix 中的 Shebangs，它提供了您希望用来执行脚本的特定 JavaScript 解释器的路径。在 hashbang 注释成为标准化注释之前，它已经在 Node.js 等非浏览器主机中实现，在将其传递给引擎之前，会从源代码文本中剥离。下面是一个例子：
+
+```javascript
+#!/usr/bin/env node
+
+console.log("Hello world")
+```
+
+JavaScript 解释器会将其视为普通注释，只有当脚本直接在 shell 中运行时，它才对 shell 有语义意义。
+
+## Symbols 作为弱集合的键
+
+```javascript
+const map = new WeakMap()
+const key = Symbol()
+map.set(key, 1)
+```