您的位置:首页 > 教程笔记 > 前端笔记

如何遍历js对象

2024-06-22 12:24:42 前端笔记 138

遍历 JavaScript 对象

如何遍历 JavaScript 对象?

要遍历 JavaScript 对象,最常用的方法是使用 for…in 循环。它遍历对象的所有可枚举属性,包括那些继承自原型链的属性。

使用 for…in 循环

const person = {
  name: "John Doe",
  age: 30,
  city: "New York"
};

for (const property in person) {
  console.log(`${property}: ${person[property]}`);
}

输出:

name: John Doe
age: 30
city: New York

注意: for…in 循环还遍历继承的属性,因此可能会输出其他属性,具体取决于对象的原型链。

使用 Object.keys

要仅遍历对象的自身可枚举属性,可以使用 Object.keys 方法。它返回一个包含所有键的数组。

const person = {
  name: "John Doe",
  age: 30,
  city: "New York"
};

const keys = Object.keys(person);

for (const key of keys) {
  console.log(`${key}: ${person[key]}`);
}

输出:

name: John Doe
age: 30
city: New York

使用 Object.values

要仅遍历对象的自身可枚举属性值,可以使用 Object.values 方法。它返回一个包含所有值的数组。

const person = {
  name: "John Doe",
  age: 30,
  city: "New York"
};

const values = Object.values(person);

for (const value of values) {
  console.log(value);
}

输出:

John Doe
30
New York

使用 Object.entries

要遍历对象的自身可枚举属性的键值对,可以使用 Object.entries 方法。它返回一个包含键值对数组的数组。

const person = {
  name: "John Doe",
  age: 30,
  city: "New York"
};

const entries = Object.entries(person);

for (const [key, value] of entries) {
  console.log(`${key}: ${value}`);
}

输出:

name: John Doe
age: 30
city: New York

其他方法

还有一些其他方法可以遍历 JavaScript 对象,但它们的使用不那么普遍:

forEach 方法
map 方法
filter 方法
some 方法
every 方法

相关推荐

  • js调试工具和方法如何使用

    js调试工具和方法如何使用

    JS 调试工具和方法1. 调试工具Chrome DevTools: 集成的浏览器工具,提供广泛的调试功能。Node.js 调试器: 用于调试 Node.js 应用程序的命令行工具。VS Code 调试

    前端笔记 2024-06-22 12:24:36 95
  • js如何定义一个方法

    js如何定义一个方法

    如何在 JavaScript 中定义方法在 JavaScript 中,方法是一个与对象关联的函数。您可以使用以下语法定义一个方法:objectName.methodName = function(pa

    前端笔记 2024-06-22 12:24:28 81
  • js如何遍历map对象

    js如何遍历map对象

    如何遍历 JavaScript 中的 Map 对象遍历 JavaScript 中的 Map 对象的方法有多种,具体取决于您希望如何访问其中的键值对。使用 forEach() 方法forEach() 方

    前端笔记 2024-06-22 12:24:20 160
  • js如何合并对象

    js如何合并对象

    JavaScript 中合并对象的技巧在 JavaScript 中,合并对象是一种常见的操作,用于将多个对象的属性和值组合成一个新的对象。以下介绍了 JavaScript 中合并对象的三种主要方式:1

    前端笔记 2024-06-22 12:24:16 42
  • js数组方法怎么用

    js数组方法怎么用

    JS 数组方法简介JavaScript 数组提供了广泛的方法,用于操作和管理数组中的元素。这些方法分为两大类别:修改数组和不修改数组。修改数组的方法push(): 在数组末尾添加一个或多个元素。pop

    前端笔记 2024-06-22 12:23:56 198