JS 中对象分为可迭代和不可迭代 如果是可迭代哪它就会有一个 [Symbol.iterator] 函数
这个函数就是对象的迭代器函数, 如用 for of 如果遍历的对象没有这个迭代方法那么就会报错
for of 传入的是可迭代对象, 但是如何吧一个不可迭代的对象变为可迭代的对象呢!
很简单就是自己写一个 [Symbol.iterator] 函数.
代码如下:
- <!DOCTYPE html>
- <HTML lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
- <title>
- Document
- </title>
- </head>
- <body>
- <script>
- let obj = {
- a: 1,
- b: 2
- }
- obj[Symbol.iterator] = function() {
- // 取到对象的每个 key 值返回一个数组
- let keys = Object.keys(obj);
- // 取到 key 值的长度
- let len = keys.length;
- // 定义循环变量
- let n = 0;
- // 返回对象 每次迭代会自动调用对象里面的 next 方法
- return {
- next() {
- if (n < len) {
- // 返回值有 value 和 done
- //value 能自定义
- //done 为 true 跳出循环
- return {
- value: {
- k: keys[n],
- v: obj[keys[n++]]
- },
- done: false
- }
- } else {
- return {
- done: true
- }
- }
- }
- }
- }
- // 循环
- //for of 只能遍历可迭代对象
- // 所以自己写了个迭代器 详情请查阅 web 迭代协议
- // 返回的是个对象的 key 和 value
- for (let {
- k,
- v
- }
- of obj) {
- console.log(k, v);
- }
- </script>
- </body>
- </HTML>
注释很完整就不多讲了,
输出如下:
希望能够帮助到你们!!
来源: http://www.bubuko.com/infodetail-2987879.html