ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

如何在JavaScript中使用for循环

2022-11-14 22:25:19  阅读:327  来源: 互联网

标签:java 函数 学习 系统 语言 平台 方法 安装 QML c++ 数据


前言

循环允许我们通过循环数组或对象中的项并做一些事情,比如说打印它们,修改它们,或执行其他类型的任务或动作。JavaScript有各种各样的循环,for循环允许我们对一个集合(如数组)进行迭代。

在这篇文章中,我们将了解JavaScript提供的for循环。我们将看看for...in循环语句是如何在JavaScript中使用的,它的语法,它如何工作的例子,何时使用它或避免它,以及我们可以使用哪些其他类型的循环来代替。

为什么使用for循环

在JavaScript中,就像在其他编程语言中一样,我们使用循环来读取或访问集合中的项。这个集合可以是一个数组或一个对象。每当循环语句在一个集合中的项中循环时,我们称之为一个迭代

有两种方式可以访问集合中的项。第一种方式是通过它在集合中的键,也就是数组中的索引或对象中的属性。第二种方式是通过集合项本身,而不需要键。

for…in循环的定义

JavaScript的for循环会或迭代集合中的键。使用这些键,你就可以访问它在集合中代表的项。

集合的项可以是数组,也可以是对象,甚至可以是字符串。

for…in循环的语法

for循环具有以下语法或结构:

for (let key in value) {
  //do something here
}

在上述代码块中,value是我们迭代的项的集合。它可以是对象、数组、字符串等等。key会是value每一项的键,在每次迭代中都会改变到列表中的下一个键。

注意,这里我们使用letconst来声明key

for-in-loop-diagram.png

在对象中使用for…in循环

在JavaScript中使用for...in循环迭代对象时,其迭代的键或者属性是对象自己的属性(在上面的示例中,由key变量表示)。

由于对象可能通过原型链继承数据项,其中包括对象的默认方法和属性,以及我们可能定义的对象原型,因此我们应该使用hasOwnProperty

在下面的例子中,我们通过变量obj进行循环,并打印每一个属性和值:

const obj = {
  "a": "JavaScript",
  1: "PHP",
  "b": "Python",
  2: "Java"
};

for (let key in obj) {
  console.log(key + ": " + obj[key] )
}

// Output:
// "1: PHP"
// "2: Java"
// "a: JavaScript"
// "b: Python"

请注意,键的迭代顺序是升序的(也就是说,从数字开始,按数字的顺序,然后是字母,按字母的顺序)。然而,这个输出的顺序与初始化对象时创建的项的索引顺序不同。

在数组中使用for…in循环

在JavaScript中使用for...in循环来迭代数组时,在这种情况下,key将是元素的索引。然而,索引可以按随机顺序迭代。

因此,如果我们上面展示的for...in循环语法结构中的value变量是一个包含五项的数组,那么key就不能保证是0到4。一些索引可能会在其他索引之前。关于何时可能发生这种情况的细节将在本文后面解释。

在下面的例子中,我们对arr变量进行循环:

const arr = ["JavaScript", "PHP", "Python", "Java"];

for (let key in arr) {
  console.log(key + ": " + arr[key])
}

// Output:
// "0: JavaScript"
// "1: PHP"
// "2: Python"
// "3: Java"

在循环中,我们呈现每个数组元素的索引和值。

在字符串中使用for…in循环

你可以在JavaScript中使用for…in循环来循环字符串。然而,不推荐这么做,因为你将在字符串的索引上循环,而不是字符串本身。

在下面的例子中,我们对str变量进行循环:

const str = "Hello!";

for (let key in str) {
  console.log(key + ": " + str.charAt(key));
}

//Output
// "0: H"
// "1: e"
// "2: l"
// "3: l"
// "4: o"
// "5: !"

在这个循环中,我们要呈现每个字符的键或索引,以及该索引的字符。

让我们看看JavaScript for…in循环最适合的情况。

标签:java,函数,学习,系统,语言,平台,方法,安装,QML,c++,数据
来源:

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有