迭代器輔助函式 是新增至迭代器原型上的一組方法,有助於一般使用迭代器。由於這些輔助方法位於迭代器原型上,因此任何在原型鏈中包含 Iterator.prototype
的物件(例如陣列迭代器)都將取得這些方法。在以下小節中,我們將說明迭代器輔助函式。所有提供的範例都可以在部落格文章清單的部落格歸檔頁面中運作,說明迭代器輔助函式如何協助尋找和操作文章。您可以在 V8 部落格頁面 上試試看!
.map(mapperFn) #
map
將 mapper 函式作為引數。此輔助函式傳回一個值迭代器,其中 mapper 函式已套用至原始迭代器值。
// Select the list of blog posts from a blog archive page.
const posts = document.querySelectorAll('li:not(header li)');
// Get the list of posts, return a list of their text content (titles) and log them.
for (const post of posts.values().map((x) => x.textContent)) {
console.log(post);
}
.filter(filtererFn) #
filter
將 filter 函式作為引數。此輔助函式傳回一個值迭代器,其中 filter 函式傳回真值原始迭代器值。
// Select the list of blog posts from a blog archive page.
const posts = document.querySelectorAll('li:not(header li)');
// Filter blog posts that includes `V8` in their text content (titles) and log them.
for (const post of posts.values().filter((x) => x.textContent.includes('V8'))) {
console.log(post);
}
.take(limit) #
take
將整數作為引數。此輔助函式傳回一個值迭代器,其中原始迭代器值最多為 limit
值。
// Select the list of blog posts from a blog archive page.
const posts = document.querySelectorAll('li:not(header li)');
// Select 10 recent blog posts and log them.
for (const post of posts.values().take(10)) {
console.log(post);
}
.drop(limit) #
drop
將整數作為引數。此輔助函式傳回一個值迭代器,其中原始迭代器值從 limit
值之後開始。
// Select the list of blog posts from a blog archive page.
const posts = document.querySelectorAll('li:not(header li)');
// Drop 10 recent blog posts and log the rest of them.
for (const post of posts.values().drop(10)) {
console.log(post);
}
.flatMap(mapperFn) #
flatMap
將 mapper 函式作為引數。此輔助函式傳回一個值迭代器,其中迭代器值是將 mapper 函式套用至原始迭代器值所產生的迭代器。也就是說,mapper 函式傳回的迭代器會扁平化至此輔助函式傳回的迭代器中。
// Select the list of blog posts from a blog archive page.
const posts = document.querySelectorAll('li:not(header li)');
// Get list of tags of the blog posts and log them. Each post can have more than
// one tag.
for (const tag of posts.values().flatMap((x) => x.querySelectorAll('.tag').values())) {
console.log(tag.textContent);
}
.reduce(reducer [, initialValue ]) #
reduce
採用一個還原函式和一個可選的初始值。此輔助函式會傳回一個值,為將還原函式套用至迭代器每個值後的結果,同時追蹤套用還原函式的最後結果。初始值會在還原函式處理迭代器第一個值時,作為起點使用。
// Select the list of blog posts from a blog archive page.
const posts = document.querySelectorAll('li:not(header li)');
// Get list of tags for all posts.
const tagLists = posts.values().flatMap((x) => x.querySelectorAll('.tag').values());
// Get text context for each tag in the list.
const tags = tagLists.map((x) => x.textContent);
// Counts posts with security tag.
const count = tags.reduce((sum , value) => sum + (value === 'security' ? 1 : 0), 0);
console.log(count);
.toArray() #
toArray
會從迭代器值傳回一個陣列。
// Select the list of blog posts from a blog archive page.
const posts = document.querySelectorAll('li:not(header li)');
// Create an array from the list of 10 recent blog posts.
const arr = posts.values().take(10).toArray();
.forEach(fn) #
forEach
採用一個函式作為引數,並套用至迭代器的每個元素。此輔助函式會因為其副作用而被呼叫,並傳回 undefined
。
// Select the list of blog posts from a blog archive page.
const posts = document.querySelectorAll('li:not(header li)');
// Get the dates that at least one blog post is published and log them.
const dates = new Set();
const forEach = posts.values().forEach((x) => dates.add(x.querySelector('time')));
console.log(dates);
.some(fn) #
some
採用一個謂詞函式作為引數。此輔助函式會在函式套用至任何迭代器元素時傳回 true
。呼叫 some
之後,會消耗迭代器。
// Select the list of blog posts from a blog archive page.
const posts = document.querySelectorAll('li:not(header li)');
// Find out if text content (title) of any blog post includes the `Iterators`
// keyword.
posts.values().some((x) => x.textContent.includes('Iterators'));
.every(fn) #
every
採用一個謂詞函式作為引數。此輔助函式會在函式套用至每個迭代器元素時傳回 true
。呼叫 every
之後,會消耗迭代器。
// Select the list of blog posts from a blog archive page.
const posts = document.querySelectorAll('li:not(header li)');
// Find out if text content (title) of all blog post includes the `V8` keyword.
posts.values().every((x) => x.textContent.includes('V8'));
.find(fn) #
find
採用一個謂詞函式作為引數。此輔助函式會傳回迭代器中第一個函式傳回真值的值,或如果迭代器中沒有任何值,則傳回 undefined
。
// Select the list of blog posts from a blog archive page.
const posts = document.querySelectorAll('li:not(header li)');
// Log the text content (title) of the recent blog post includes `V8` keyword.
console.log(posts.values().find((x) => x.textContent.includes('V8')).textContent);
Iterator.from(object) #
from
是靜態方法,採用一個物件作為引數。如果 object
已是 Iterator 的執行個體,則此輔助函式會直接傳回它。如果 object
有 Symbol.iterator
,表示它是可迭代的,則會呼叫其 Symbol.iterator
方法以取得迭代器,而輔助函式會傳回它。否則,會建立一個新的 Iterator
物件(繼承自 Iterator.prototype
,並有 next()
和 return()
方法),它會包裝 object
,並由此輔助函式傳回。
// Select the list of blog posts from a blog archive page.
const posts = document.querySelectorAll('li:not(header li)');
// First create an iterator from the posts. Then, log the text content (title) of
// the recent blog post that includes the `V8` keyword.
console.log(Iterator.from(posts).find((x) => x.textContent.includes('V8')).textContent);
可用性 #
Iterator 輔助函式會在 V8 v12.2 中出貨。