【金秋打卡】第15天 4-13 迭代器Iterator
课程名称:JavaScript ES(6-11)全版本语法 每个前端都需要的基础课
课程章节:4-13 迭代器Iterator
课程讲师: 谢成
课程内容:
迭代器Iterator
课程收获:
迭代器Iterator
在 JavaScript 中,迭代器是一个对象,它定义一个序列,并在终止时可能返回一个返回值。更具体地说,迭代器是通过使用 next() 方法实现 Iterator protocol 的任何一个对象,该方法返回具有两个属性的对象: value,这是序列中的 next 值;和 done ,如果已经迭代到序列中的最后一个值,则它为 true 。如果 value 和 done 一起存在,则它是迭代器的返回值。
一旦创建,迭代器对象可以通过重复调用 next()显式地迭代。迭代一个迭代器被称为消耗了这个迭代器,因为它通常只能执行一次。在产生终止值之后,对 next()的额外调用应该继续返回{done:true}。
Javascript 中最常见的迭代器是 Array 迭代器,它只是按顺序返回关联数组中的每个值。虽然很容易想象所有迭代器都可以表示为数组,但事实并非如此。数组必须完整分配,但迭代器仅在必要时使用,因此可以表示无限大小的序列,例如 0 和无穷大之间的整数范围。
这是一个可以做到这一点的例子。它允许创建一个简单的范围迭代器,它定义了从开始(包括)到结束(独占)间隔步长的整数序列。它的最终返回值是它创建的序列的大小,由变量 iterationCount 跟踪。
// function makeIterator(arr) {
// let nextIndex = 0
// return {
// next() {
// return nextIndex < arr.length ? {
// value: arr[nextIndex++],
// done: false
// } : {
// value: undefined,
// done: true
// }
// }
// }
// }
// let it = makeIterator(['a', 'b', 'c'])
// console.log(it.next())
// console.log(it.next())
// console.log(it.next())
// console.log(it.next())
// for(let c of courses){
// console.log(c)
// }
// let arr = ['a', 'b', 'c']
// console.log(arr)
// let it = arr[Symbol.iterator]()
// console.log(it.next())
// console.log(it.next())
// console.log(it.next())
// console.log(it.next())
// let map = new Map()
// map.set('name', 'es')
// map.set('age', 5)
// map.set('school', 'imooc')
// // console.log(map)
// let it = map[Symbol.iterator]()
// console.log(it.next())
// console.log(it.next())
// console.log(it.next())
// console.log(it.next())
let courses = {
allCourse: {
frontend: ['ES', '小程序', 'Vue', 'React'],
backend: ['Java', 'Python', 'SpringBoot'],
webapp: ['Android', 'IOS']
}
}
// 可迭代协议:Symbol.iterator
// 迭代器协议:return { next(){ return{value, done} }}
// courses[Symbol.iterator] = function () {
// let allCourse = this.allCourse
// let keys = Reflect.ownKeys(allCourse)
// let values = []
// return {
// next() {
// if (!values.length) {
// if (keys.length) {
// values = allCourse[keys[0]]
// keys.shift()
// }
// }
// return {
// done: !values.length,
// value: values.shift()
// }
// }
// }
// }
// for (let c of courses) {
// console.log(c)
// }
// generator
courses[Symbol.iterator] = function* () {
let allCourse = this.allCourse
let keys = Reflect.ownKeys(allCourse)
let values = []
while (1) {
if (!values.length) {
if (keys.length) {
values = allCourse[keys[0]]
keys.shift()
yield values.shift()
} else {
return false
}
}else{
yield values.shift()
}
}
}
for (let c of courses) {
console.log(c)
}
谢谢老师,讲的非常细致,很容易懂。这一节学的是迭代器Iterator,给以后的学习打下了基础。
原来ES6-11能有这么多种性质,以及对ES6-11有了新的认识,期待后边的学习
共同学习,写下你的评论
评论加载中...
作者其他优质文章