From 84fe44b94006e4585638b38f60ecf23708182d2a Mon Sep 17 00:00:00 2001 From: Xicheng Guo Date: Tue, 30 Jul 2024 14:25:03 +0800 Subject: [PATCH] update iterator md --- src/.vitepress/sidebars/ecma-script.yaml | 18 ++++-- .../nodejs/file-system/stream-operation.md | 6 +- .../custom-iterator.md | 27 -------- .../iterator-custom.md | 13 ++++ .../iterator-pattern.md | 23 +++++++ .../iterators-and-generators/iterator.md | 64 +++---------------- 6 files changed, 60 insertions(+), 91 deletions(-) delete mode 100644 src/javascript/ecma-script/iterators-and-generators/custom-iterator.md create mode 100644 src/javascript/ecma-script/iterators-and-generators/iterator-custom.md create mode 100644 src/javascript/ecma-script/iterators-and-generators/iterator-pattern.md diff --git a/src/.vitepress/sidebars/ecma-script.yaml b/src/.vitepress/sidebars/ecma-script.yaml index 5eaa248..c67214e 100644 --- a/src/.vitepress/sidebars/ecma-script.yaml +++ b/src/.vitepress/sidebars/ecma-script.yaml @@ -123,14 +123,22 @@ items: - text: 什么是迭代器 link: /javascript/ecma-script/iterators-and-generators/iterator#什么是迭代器 + - text: 迭代方式的演变 + link: /javascript/ecma-script/iterators-and-generators/iterator#迭代方式的演变 + - text: 迭代器模式 + link: /javascript/ecma-script/iterators-and-generators/iterator-pattern + items: - text: 可迭代协议 - link: /javascript/ecma-script/iterators-and-generators/iterator#可迭代协议 + link: /javascript/ecma-script/iterators-and-generators/iterator-pattern#可迭代协议 - text: 迭代器协议 - link: /javascript/ecma-script/iterators-and-generators/iterator#迭代器协议 - - text: 提前终止迭代 - link: /javascript/ecma-script/iterators-and-generators/iterator#提前终止迭代 + link: /javascript/ecma-script/iterators-and-generators/iterator-pattern#迭代器协议 - text: 自定义迭代器 - link: /javascript/ecma-script/iterators-and-generators/custom-iterator + link: /javascript/ecma-script/iterators-and-generators/iterator-custom + items: + - text: 实现迭代器接口 + link: /javascript/ecma-script/iterators-and-generators/iterator-custom#实现迭代器接口 + - text: 提前终止迭代 + link: /javascript/ecma-script/iterators-and-generators/iterator-custom#提前终止迭代 - text: 生成器 link: /javascript/ecma-script/iterators-and-generators/generator - text: JSON diff --git a/src/backend/nodejs/file-system/stream-operation.md b/src/backend/nodejs/file-system/stream-operation.md index 5c0bece..755fe6a 100644 --- a/src/backend/nodejs/file-system/stream-operation.md +++ b/src/backend/nodejs/file-system/stream-operation.md @@ -2,12 +2,12 @@ ## 读取流 -<<< @/../projects/javascript-sandbox/src/file-system/stream-read.ts +<<< @/../projects/javascript-sandbox/src/file-system/stream-read.ts#read ## 写入流 -<<< @/../projects/javascript-sandbox/src/file-system/stream-write.ts +<<< @/../projects/javascript-sandbox/src/file-system/stream-write.ts#write ## 管道流 -<<< @/../projects/javascript-sandbox/src/file-system/stream-pipe.ts +<<< @/../projects/javascript-sandbox/src/file-system/stream-pipe.ts#pipe diff --git a/src/javascript/ecma-script/iterators-and-generators/custom-iterator.md b/src/javascript/ecma-script/iterators-and-generators/custom-iterator.md deleted file mode 100644 index 0e7e0fc..0000000 --- a/src/javascript/ecma-script/iterators-and-generators/custom-iterator.md +++ /dev/null @@ -1,27 +0,0 @@ -# 自定义迭代器 - -任何实现 Iterable 接口的对象都可以作为迭代器使用。 - -为了让一个可迭代对象能够创建多个迭代器，必须每创建一个迭代器就对应一个新计数器。为此，可以把计数器变量放到闭包里，然后通过闭包返回迭代器。 - -```js -class Counter { - constructor(limit) { - this.limit = limit; - } - - [Symbol.iterator]() { - let count = 1, - limit = this.limit; - return { - next() { - if (count <= limit) { - return { done: false, value: count++ }; - } else { - return { done: true, value: undefined }; - } - }, - }; - } -} -``` diff --git a/src/javascript/ecma-script/iterators-and-generators/iterator-custom.md b/src/javascript/ecma-script/iterators-and-generators/iterator-custom.md new file mode 100644 index 0000000..03ed330 --- /dev/null +++ b/src/javascript/ecma-script/iterators-and-generators/iterator-custom.md @@ -0,0 +1,13 @@ +# 自定义迭代器 + +## 实现迭代器接口 + +任何实现了 Iterator 接口的对象都可以作为迭代器使用。 + +<<<@/../projects/javascript-sandbox/src/iterators-and-generators/iterator-custom.ts#custom-iterator + +## 提前终止迭代 + +可选的 `return()` 方法定义了在迭代器被提前关闭时执行的操作。 + +<<<@/../projects/javascript-sandbox/src/iterators-and-generators/iterator-custom.ts#early-termination diff --git a/src/javascript/ecma-script/iterators-and-generators/iterator-pattern.md b/src/javascript/ecma-script/iterators-and-generators/iterator-pattern.md new file mode 100644 index 0000000..54c2584 --- /dev/null +++ b/src/javascript/ecma-script/iterators-and-generators/iterator-pattern.md @@ -0,0 +1,23 @@ +# 迭代器模式 + +ES6 引入的迭代器模式，`Iterable` 接口定义了对象是否可迭代，`Iterator` 接口定义了对象如何迭代。 + +## 可迭代协议 + +任何实现了 `[Symbol.iterator]()` 方法的对象都被认为是可迭代的，这个方法必须返回一个 `Iterator` 对象。 + +ES 内置的可迭代对象有：数组、Map、Set、字符串、arguments 对象、NodeList 对象。 + +<<< @/../projects/javascript-sandbox/src/iterators-and-generators/iterator.ts#iterable-protocol + +可迭代对象可以使用 `for...of` 循环，`...` 扩展运算符，解构赋值进行迭代。 + +<<< @/../projects/javascript-sandbox/src/iterators-and-generators/iterator.ts#iterator-method + +## 迭代器协议 + +`Iterator` 接口定义了一个 `next()` 方法，该方法返回一个包含 `done` 和 `value` 属性的对象，`done` 是一个布尔值，指示是否还有更多值可以迭代，`value` 包含当前的值。 + +当 `done = true` 时，`value = undefined`时，表示迭代结束。 + +<<< @/../projects/javascript-sandbox/src/iterators-and-generators/iterator.ts#iterator-protocol diff --git a/src/javascript/ecma-script/iterators-and-generators/iterator.md b/src/javascript/ecma-script/iterators-and-generators/iterator.md index 0bb737c..a3f2532 100644 --- a/src/javascript/ecma-script/iterators-and-generators/iterator.md +++ b/src/javascript/ecma-script/iterators-and-generators/iterator.md @@ -1,69 +1,21 @@ # 迭代器 -## 什么是迭代器 - ::: details 什么是迭代 -迭代就是在一个有序集合上顺序访问元素的过程。 -::: - -迭代器提供了一种方法，使得任何支持可迭代协议的对象都能在不暴露内部结构的情况下访问其中的元素。 - -::: details 迭代方式的演变 - -JavaScript 中的 for 循环提供了一种基础的迭代方式，但这要求开发者明确知道如何与数据结构交互，例如通过索引访问数组元素。这种方法依赖于数据结构的内部实现细节，并且不适用于所有类型的数据结构。 - -ES5 新增的`forEach`方法允许开发者无需直接管理索引即可遍历数组，这项功能向通用迭代需求迈进了一步，但是`forEach`方法不能在迭代过程中提前终止（除非抛出异常），因此仍然不够理想。 - -为了解决这些限制，ES6 引入了迭代器模式，这是一种使开发者无需预先知道集合的内部结构即可遍历集合的方法。 -::: - -## 可迭代协议 - -可迭代协议允许对象表明自己支持迭代。 - -要遵循此协议，对象必须暴露一个特殊属性`Symbol.iterator`，该属性是一个函数，调用该函数会返回一个迭代器对象，迭代器对象必须遵循迭代器协议。 - -::: details 内置迭代 - -内置可迭代对象：数组、Map、Set、字符串、arguments 对象、NodeList 对象、TypedArray 对象、Generator 对象。 - -内置迭代方法：for...of 循环、...扩展运算符、解构赋值 +迭代就是在一个有序集合上顺序访问元素的过程。 ::: -## 迭代器协议 +## 什么是迭代器 -迭代器代表对其关联可迭代对象的一次性有序遍历。 +迭代器提供了一种方法，使得任何支持可迭代协议的对象都能在不暴露内部结构的情况下访问其中的元素。 -迭代器的核心方法`next()`用于在遍历过程中逐一访问数据。每次调用`next()`成功时，都会返回一个包含`done`和`value`属性的对象。`done`是一个布尔值，指示是否还有更多值可以迭代；`value`包含当前的值，在`done=true`时`value=undefined`。 +## 迭代方式的演变 -## 提前终止迭代 +`Javascript` 中的 `for` 循环提供了一种基础的迭代方式，但这要求开发中明确知道如何与数据结构交互（例如：通过索引访问数组元素）。 -迭代器可以可选地实现一个 return 方法，该方法定义了在迭代器被提前关闭时执行的操作，它应当返回一个有效的迭代器结果对象，通常是`{ done: true }`。如果迭代器没有关闭，它可以从上次停止的地方继续迭代。 +这种基础迭代方式依赖于数据结构内部的实现细节，并不适用于所有类型的数据结构。 -```js -class Counter { - constructor(limit) { - this.limit = limit; - } +`ES5` 新增的 `forEach` 方法允许开发者在无需管理索引的情况下迭代数组，这项功能向通用迭代迈进了一步，但 `forEach` 方法不能在迭代过程中提前终止（除非抛出异常），因此仍然不够理想。 - [Symbol.iterator]() { - let count = 1, - limit = this.limit; - return { - next() { - if (count <= limit) { - return { done: false, value: count++ }; - } else { - return { done: true }; - } - }, - return() { - console.log("Exiting early"); - return { done: true }; - }, - }; - } -} -``` +`ES6` 引入了迭代器模式解决了这些限制，这是一种使开发者无需预先知道集合的内部结构即可遍历集合的方法。