JavaScript for...in 循环

x33g5p2x  于2022-04-23 转载在 Java  
字(1.4k)|赞(0)|评价(0)|浏览(365)

在本教程中,您将借助示例了解 JavaScript for…in 循环。
    在之前的教程中,我们介绍了:

  • JavaScript while 和 do…while 循环
  • JavaScript for 循环

还有其他类型的循环。JavaScript 中的 for…in 循环允许您遍历对象的所有属性键。

JavaScript for…in 循环

for…in 循环的语法是:

  1. for (key in object) {
  2. // body of for...in
  3. }

在循环的每次迭代中,一个键被分配给 key 变量。对于所有对象属性,循环继续。
    注意:一旦你得到键,你可以很容易地找到它们对应的值。

示例 1:遍历对象
  1. const student = {
  2. name: 'Monica',
  3. class: 7,
  4. age: 12
  5. }
  6. // using for...in
  7. for ( let key in student ) {
  8. // display the properties
  9. console.log(`${key} => ${student[key]}`);
  10. }

输出

  1. name => Monica
  2. class => 7
  3. age => 12

在上面的程序中,for…in 循环用于迭代 student 对象并打印其所有属性。

  • 对象键被指定给变量 key。
  • student[key] 用于访问的值 key。
示例 2:更新属性值
  1. const salaries= {
  2. Jack : 24000,
  3. Paul : 34000,
  4. Monica : 55000
  5. }
  6. // using for...in
  7. for ( let i in salaries) {
  8. // add a currency symbol
  9. let salary = "$" + salaries[i];
  10. // display the values
  11. console.log(`${i} : ${salary}`);
  12. }

输出

  1. Jack : $24000,
  2. Paul : $34000,
  3. Monica : $55000

在上面的示例中,for…in 循环用于迭代 salaries 对象的属性。然后,字符串 $ 被添加到对象的每个值中。

for…in 与字符串

您还可以使用 for…in 循环来迭代字符串值。例如,

  1. const string = 'code';
  2. // using for...in loop
  3. for (let i in string) {
  4. console.log(string[i]);
  5. }

输出

  1. c
  2. o
  3. d
  4. e
for…in 与数组

您也可以将 for…in 与数组一起使用。例如,

  1. // define array
  2. const arr = [ 'hello', 1, 'JavaScript' ];
  3. // using for...in loop
  4. for (let x in arr) {
  5. console.log(arr[x]);
  6. }

输出

  1. hello
  2. 1
  3. JavaScript

您将在后面的教程中了解有关数组的更多信息。
    注意:当迭代索引顺序很重要的数组时,你不应该使用 for…in。
    迭代数组的更好方法之一是使用 for…of 循环。
    要了解有关 for…of 循环的更多信息,请访问JavaScript for…of 循环

上一教程 :JS Strings                                          下一教程 :JS Numbers

参考文档

[1] Parewa Labs Pvt. Ltd. (2022, January 1). Getting Started With JavaScript, from Parewa Labs Pvt. Ltd: https://www.programiz.com/javascript/for-in

相关文章

最新文章

更多