Iterators迭代器 挑战1 问题:
A) 创建一个for循环,用于遍历数组,返回数组的所有元素的总和。
B) 创建一个函数式迭代器,调用时遍历传入的数组的每一个元素,每次一个元素。
题解: // CHALLENGE 1
function sumFunc(arr) { // YOUR CODE HERE let sum = 0 for(let i = 0; i < arr.length; i++) {
sum += arr[i]
} return sum }
// Uncomment the lines below to test your work const array = [1, 2, 3, 4]; console.log(sumFunc(array)); // -> should log 10
function returnIterator(arr) { // YOUR CODE HERE let i = 0 const inner = () => {
const element = arr[i]
i++
return element
} return inner }
// Uncomment the lines below to test your work const array2 = ['a', 'b', 'c', 'd']; const myIterator = returnIterator(array2); console.log(myIterator()); // -> should log 'a' console.log(myIterator()); // -> should log 'b' console.log(myIterator()); // -> should log 'c' console.log(myIterator()); // -> should log 'd' 挑战2 问题:
创建一个附有next方法的迭代器。当.next被调用时,此迭代器会逐个返回数组内的元素。
题解:
// CHALLENGE 2
function nextIterator(arr) { // YOUR CODE HERE let i = 0 const inner = {
next: () => {
const element = arr[i]
i++
return element
}
} return inner }
// Uncomment the lines below to test your work const array3 = [1, 2, 3]; const iteratorWithNext = nextIterator(array3); console.log(iteratorWithNext.next()); // -> should log 1 console.log(iteratorWithNext.next()); // -> should log 2 console.log(iteratorWithNext.next()); // -> should log 3 挑战3 问题:
编写代码,使用上方的nextIterator函数遍历一整个数组,然后求和。
题解: // CHALLENGE 3
function sumArray(arr) { // YOUR CODE HERE // use your nextIterator function const iteratorWithNext = nextIterator(arr) let sum = 0 let item while(item = iteratorWithNext.next()) {
sum += item
} return sum }
// Uncomment the lines below to test your work const array4 = [1, 2, 3, 4]; console.log(sumArray(array4)); // -> should log 10 挑战4 问题:
创建一个附有next方法的迭代器。当调用.next时,它会返回传入的set集合的每一个元素。
题解: // CHALLENGE 4
function setIterator(set) { // YOUR CODE HERE // Solution One: // let i = 0 // const arr = [...set] // return { // next: () => arr[i++] // } // Solution Two: const newSet = set[Symbol.iterator]() return {next: () => newSet.next().value} }
// Uncomment the lines below to test your work const mySet = new Set('hey'); const iterateSet = setIterator(mySet); console.log(iterateSet.next()); // -> should log 'h' console.log(iterateSet.next()); // -> should log 'e' console.log(iterateSet.next()); // -> should log 'y' 挑战5 问题:
创建一个附有next方法的迭代器。当调用.next时,它会返回带有两个元素的数组(第一个为下标,第二个为下标对应的数组元素)。
题解: // CHALLENGE 5
function indexIterator(arr) { // YOUR CODE HERE let i = 0 return {
next: () => {
const element = arr[i]
const index = i
i++
return [index, element]
}
} }
// Uncomment the lines below to test your work const array5 = ['a', 'b', 'c', 'd']; const iteratorWithIndex = indexIterator(array5); console.log(iteratorWithIndex.next()); // -> should log [0, 'a'] console.log(iteratorWithIndex.next()); // -> should log [1, 'b'] console.log(iteratorWithIndex.next()); // -> should log [2, 'c'] 挑战6 问题:
创建一个迭代器。在它的.next方法被调用时,它会返回一个句子型字符串中的每一个单词。
(提示:使用正则表达式!)
然后将此操作当成一个方法挂载到构建函数Words的原型链上。
(提示:研究Symbol.iterator!)
题解: // CHALLENGE 6
function Words(string) { this.str = string; }
Words.prototype[Symbol.iterator] = function() { // YOUR CODE HERE const reg = /\w+/g const strArr = this.str.match(reg) let index = 0 return {
next: () =>
(index < strArr.length) ?
{ done: false, value: strArr[index++] } :
{ done: true, value: undefined }
} }
// Uncomment the lines below to test your work const helloWorld = new Words('Hello World'); for (let word of helloWorld) { console.log(word); } // -> should log 'Hello' and 'World' 挑战7 问题:
创建一个函数。此函数会遍历传入的数组,返回对应的遍历元素和字符串“was found after index x”拼接而成的字符串结果,其中的x是前一个下标。
注意:对于第一个元素,它应该返回“It is the first”。
题解: // CHALLENGE 7
function valueAndPrevIndex(array){ const iteratedArray = array[Symbol.iterator]() let index = 0 return {
sentence: () => {
if (index == 0) {
iteratedArray.next()
index++
return `It is the first`
} else {
const result = `${iteratedArray.next().value} was found after index ${index - 1}`
index++
return result
}
}
} }
const returnedSentence = valueAndPrevIndex([4,5,6]) console.log(returnedSentence.sentence()); console.log(returnedSentence.sentence()); console.log(returnedSentence.sentence()); 挑战8 问题:
编写一个函数。它会每三秒钟console.log打印“hello there”或“gibberish”,取决于传入函数的值是否为“english”。
请勿使用任何形式的循环且请仅调用createConversation一次。
题解: //CHALLENGE 8
function* createConversation(string) { let output = '' if (string === 'english') {
output = 'hello there'
} else {
output = 'gibberish'
} yield setInterval(() => {console.log(output)}, 3000) }
createConversation('english').next(); 挑战9 问题:
使用async/await来console.log打印一个由名词noun和动词verb构成的句子,其中非异步函数会接收一个名词noun,与一个硬编码的动词verb拼接,在三秒后返回给异步函数。异步函数接收到数据后,会console.log打印相应数据。异步函数仅能调用一次,传入一个名词noun见证它的执行吧!
题解: //CHALLENGE 9 function waitForVerb(noun) { return new Promise(resolve => {
const verb = 'barks'
setTimeout(() => resolve(`${noun} ${verb}`), 3000)
}) }
async function f(noun) { const sentence = await waitForVerb(noun) console.log(sentence) }
f("dog")