JavaScript 可迭代对象

admin2年前 (2023-07-07)it知识553

可迭代对象时可以使用for..of 进行迭代的对象

从技术上讲,可迭代对象必须实现Symbol.iterator方法。


遍历字符串

你可以使用for..of循环来遍历字符串的元素:


for(const x of "W3School") {
   // 要执行的代码块
}

遍历数组

你可以使用for..of 循环遍历数组中的元素:

for(const x of [1,2,3,4,5]) {
       //要执行的代码块
}

Javascript 迭代器

迭代器协议定义了如何从一个对象中生成一系列的值。

当一个对象实现了next() 方法时,它就成为了一个迭代器。

next()方法必须返回一个带有两个属性的对象:

value(下一个值)

done(true或false)

自制的可迭代对象

这个可迭代对象会无线返回:10,20,30,40......当每次调用next()时:


function myNumbers() {
     let n = 0;
     return {
           next: function() {
                n += 10;
                return { value: n, done: false };
           }
     };
}
const n = myNumbers();
n.next();   // Returns 10
n.next();   // Returns 20
n.next();   // Returns 30

这里的可迭代对象存在问题,它不支持Javascript 中的for..of语句。

Javascript中的可迭代对象是具有Symbol,iterator 属性的对象。

Symbol.iterator是一个返回next 函数的函数。

可以使用一下代码迭代可迭代对象: for (const x of iteralbe){  }

myNumbers = {};  // 创建对象
//使其可迭代
myNumbers[Symbol.iterator] = function(){
   let n = 0; 
   done = false;
   return {
     next(){
       n += 10;
       if(n == 100){ done = true }
       return { value: n, done: done };
     }
   };
}

现在可以使用for .. of 了:

for (const num of myNumbers) {
   //这里可写任何代码
}

Symbol.iterator 方法会被for..of 自动调用。

我们也可以手动调用它:

let iterator = myNumbers[Symbol.iterator]();
while(true) {
    const result= iterator.next();
    if(result.done) break;
    // 这里可写任何代码
}


标签: JavaScript

相关文章

JavaScript 对象定义

在JavaScript 中,对象是王。如果你理解了对象,就理解了javascript。在Javascript 中,几乎所有事物都是对象。 布尔是对象(如果用new 关键词定义)数字是对象(如...

JavaScript ES5 对象方法

ECMAScript 5 (2009) 向 JavaScript 添加了许多新的对象方法。管理对象// 以现有对象为原型创建对象 Object.create() //添加或更改对象属性...

electorn是什么

关于electron有以下信息:Electron 是一款可以使用 JavaScript、HTML 和 CSS 来构建跨平台桌面应用程序的开源框架,它可以让开发者使用 web 技术来创建原生应用程序。E...

如何提高前端技术

以下是一些可以提高前端技术的建议:不断学习:前端技术不断发展,需要不断学习新的技术和框架,以保持自己的竞争力。可以通过阅读相关书籍、博客、视频教程等途径进行学习。实践项目:通过实践项目,可以更深入地理...

关于Javascript

JavaScript是一种广泛使用的编程语言,用于在网页上添加交互性和动态性。它是一种高级,动态类型的脚本语言,常常与HTML和CSS一起使用,以创建丰富的用户体验。JavaScript具有以下优美的...

vue-router导航守卫

vue-router的导航守卫可以用来在路由跳转过程中添加自定义逻辑,例如验证、权限控制、重定向等。导航守卫可以分为三种:全局导航守卫、路由独享守卫和组件内的守卫1。全局导航守卫可以使用router....

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。