【JavaScript】遍历对象和数组

文章目录

    • 1. 遍历对象
      • for...in 循环
      • Object.keys()
      • Object.entries()
    • 2. 遍历数组
      • for 循环
      • forEach()
      • for...of 循环
    • 3. 遍历多维数组
    • 4. 总结

在 JavaScript 中, 遍历是一种常见的操作,用于访问对象和数组中的元素。本篇博客将将介绍 JavaScript 中遍历对象和数组的方法,以帮助你更好地理解和运用这些概念。

1. 遍历对象

for…in 循环

let person = {
  name: "John",
  age: 30,
  gender: "male"
};

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

在上述例子中,使用 for...in 循环遍历了对象 person 的所有属性,并输出属性名和对应的值。

Object.keys()

let keys = Object.keys(person);

for (let key of keys) {
  console.log(key + ": " + person[key]);
}

在上述例子中,使用 Object.keys() 方法获取了对象 person 的所有属性名,然后通过 for...of 循环遍历。

Object.entries()

for (let [key, value] of Object.entries(person)) {
  console.log(key + ": " + value);
}

在上述例子中,使用 Object.entries() 方法获取了对象 person 的所有键值对,然后通过 for...of 循环遍历。

2. 遍历数组

for 循环

let fruits = ["Apple", "Banana", "Orange"];

for (let i = 0; i < fruits.length; i++) {
  console.log(fruits[i]);
}

在上述例子中,使用 for 循环遍历了数组 fruits 的所有元素。

forEach()

fruits.forEach(function(fruit) {
  console.log(fruit);
});

在上述例子中,使用 forEach() 方法遍历了数组 fruits 的所有元素。

for…of 循环

for (let fruit of fruits) {
  console.log(fruit);
}

在上述例子中,使用 for...of 循环遍历了数组 fruits 的所有元素,提供了更简洁的语法。

3. 遍历多维数组

let matrix = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

for (let row of matrix) {
  for (let element of row) {
    console.log(element);
  }
}

在上述例子中,通过嵌套的 for...of 循环遍历了多维数组 matrix 的所有元素。

4. 总结

遍历是 JavaScript 中常见的操作,通过 for...in 循环、Object.keys()Object.entries()for 循环、forEach() 方法和 for...of 循环等方法,你可以方便地遍历对象和数组中的元素。对于多维数组,可以使用嵌套的循环进行遍历。希望通过本篇博客,你对 JavaScript 中对象和数组的遍历有了更深入的理解。

你可能感兴趣的:(JavaScript,javascript,开发语言,前端)