持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第24天,点击查看活动详情
今天开始和大家一起系统的学习ES6+,每天3分钟,用一把斗地主的时间,重学ES6+,前面我们介绍了Promsis的提出背景和用法,以及相关api, 下面我们再来学习一下Iterator-Generator。
帮助我们对某个数据结构进行遍历的对象
// 创建一个迭代器对象来访问数组
const iterableObj = {
names: ['1','2','3'], //[]可计算属性
[Symbol.iterator]:function (){
let index = 0
return {
next: ()=>{
if(index<this.names.length){
return {
done:false,
value:this.names[index++]
}
}else{
return {
done:true,
value:undefined
}
}
}
}
}
}
//iterableObj[Symbol.iterator] 就是一个可迭代对象
console.log(iterableObj[Symbol.iterator])
//调用iterableObj[Symbol.iterator]函数
const iterator = iterableObj[Symbol.iterator]()
console.log(iterator.next())
console.log(iterator.next())
console.log(iterator.next())
console.log(iterator.next())
// {done: false, value: '1'}
// {done: false, value: '2'}
// {done: false, value: '3'}
// {done: true, value: undefined}
for (const item of iterableObj) {
console.log(item)
}
// 1 2 3
// for of 可以遍历一个可迭代对象
// for of 就是一个与语法糖,获取的是迭代器的next
创建一个classroom的类
// 案例: 创建一个教室类, 创建出来的对象都是可迭代对象
class Classroom {
constructor(address, name, students) {
this.address = address
this.name = name
this.students = students
}
entry(newStudent) {
this.students.push(newStudent)
}
[Symbol.iterator]() {
let index = 0
return {
next: () => {
if (index < this.students.length) {
return { done: false, value: this.students[index++] }
} else {
return { done: true, value: undefined }
}
},
return: () => {
console.log("迭代器提前终止了~")
return { done: true, value: undefined }
}
}
}
}
const classroom = new Classroom("3幢5楼205", "计算机教室", ["james", "kobe", "curry", "why"])
classroom.entry("lilei")
for (const stu of classroom) {
console.log(stu)
if (stu === "why") break
}
// kobe
// curry
// why
// 迭代器提前终止了~
今天介绍了迭代器 可迭代对象 明天继续介绍生成器,生成器函数