T O P

[资源分享]     ES6 for of循环, 可迭代接口,实现可迭代接口

  • By - 楼主

  • 2021-01-07 18:40:14
  • 在for of循环出现之前,for循环适合遍历普通的数组,for in循环比较适合遍历键值对,遍历数组对象的foreach方法,但是这些遍历

    都有一定的局限性,所以在ES6之后引入了统一的遍历方式 for of循环 举例下图所示:

    但是此时如果遍历对象的话 会报错 obj is iterable 对象不可迭代 这是什么原因呢,如下图所示:

    js中能够表示有结构的数据类型越来越多,为了给各种各样的数据结构提供统一遍历方式,官方提供了一个Iterable的接口 可迭代的

    (符合相同的规格标准),实现Iterable 接口就是 for of的前提,也就是说原型链中必须要挂载一个Iterable方法,如下图原型所示:

    那这个方法到底是干什么的呢,从下图上不难看出 Iterable底层维护了一个next方法的对象 value值为遍历的下一个元素done属性表示

    是否遍历完

    在上文中提到 之所以能够使用for of循环遍历 是因为Iterable的接口(符合相同的规格标准),也就是说如果对象符合了这个规格标准,

    也可以使用for of循环,我们可以尝试着挂载一个Symbol.iterator方法 然后在方法中返回一个迭代器对象

    我们来梳理下这几个对象之间的关系 以及它们的作用
    1.最外层的obj对象 实现了可迭代接口 英文名 Iterable
    作用:返回一个迭代器的Symbol.iterator方法,
    2.Symbol.iterator方法 return的这个对象 实现了迭代器接口 英文名 Iterator
    作用:内部必须要有一个内部迭代的next方法,
    3.next方法中 return返回的对象 实现了迭代结果接口 英文名 IterationResult
    作用:value属性 done的布尔值 表示迭代的值和迭代是否结束

    本帖子中包含资源

    您需要 登录 才可以下载,没有帐号?立即注册