js遍历对象的方法

简介: js遍历对象的方法

JavaScript 遍历对象有多种方式,以下是常用的几种方法:

for……in循环

使用 for...in 循环可以遍历对象的可枚举属性,包括自身的属性和继承的属性。

const obj = { name: 'Alice', age: 25, gender: 'female' };
for (let key in obj) {
  console.log(key + ': ' + obj[key]);
}

注意:for...in 循环遍历的顺序不保证按照属性的添加顺序。

Object.keys() 方法配合 forEach 或 for...of 循环

使用 Object.keys() 方法可以获取对象的所有可枚举属性,并返回一个由属性名组成的数组。然后可以使用 forEach 或 for...of 循环遍历该数组,来访问每个属性的值。

const obj = { name: 'Alice', age: 25, gender: 'female' };
Object.keys(obj).forEach(function(key) {
  console.log(key + ': ' + obj[key]);
});
// 或者使用 for...of 循环
for (let key of Object.keys(obj)) {
  console.log(key + ': ' + obj[key]);
}

Object.entries()方法配合 forEach 或 for...of 循环

使用 Object.entries() 方法可以将对象转换为一个由键值对组成的数组。然后可以使用 forEach 或 for...of 循环遍历该数组,来访问每个键值对。

const obj = { name: 'Alice', age: 25, gender: 'female' };
Object.entries(obj).forEach(function([key, value]) {
  console.log(key + ': ' + value);
});
// 或者使用 for...of 循环
for (let [key, value] of Object.entries(obj)) {
  console.log(key + ': ' + value);
}

注意:Object.entries() 方法是在 ES2017 中引入的,所以在一些旧版本的浏览器中可能不支持。

Object.getOwnPropertyNames() 方法配合 forEach 或 for...of 循环

使用 Object.getOwnPropertyNames() 方法可以获取对象的所有属性(包括不可枚举属性),并返回一个由属性名组成的数组。然后可以使用 forEach 或 for...of 循环遍历该数组,来访问每个属性的值。

const obj = { name: 'Alice', age: 25, gender: 'female' };
Object.getOwnPropertyNames(obj).forEach(function(key) {
  console.log(key + ': ' + obj[key]);
});
// 或者使用 for...of 循环
for (let key of Object.getOwnPropertyNames(obj)) {
  console.log(key + ': ' + obj[key]);
}

以上就是 JavaScript 遍历对象的常用方式,根据不同的需求选择不同的方法可以更加方便和灵活地操作对象。

目录
相关文章
|
1天前
|
JavaScript 索引
JS 几种循环遍历
JS 几种循环遍历
3 0
JS 几种循环遍历
|
1天前
|
JavaScript 前端开发 开发者
JavaScript中的错误处理:try-catch语句与错误对象
【4月更文挑战第22天】JavaScript中的错误处理通过try-catch语句和错误对象实现。try块包含可能抛出异常的代码,catch块捕获并处理错误,finally块则无论是否出错都会执行。错误对象提供关于错误的详细信息,如类型、消息和堆栈。常见的错误类型包括RangeError、ReferenceError等。最佳实践包括及时捕获错误、提供有用信息、不忽略错误、利用堆栈信息和避免在finally块中抛错。
|
5天前
|
JavaScript 前端开发 Java
js 垃圾回收机制的方法
js 垃圾回收机制的方法
|
5天前
|
JavaScript 前端开发
js数据类型有几类?一共有几种?判断数据类型的方法是什么?
js数据类型有几类?一共有几种?判断数据类型的方法是什么?
|
6天前
|
JavaScript 前端开发
js绑定事件的方法
js绑定事件的方法
20 11
|
6天前
|
JavaScript
JS生成uuid的四种方法
JS生成uuid的四种方法
9 0
|
6天前
|
JavaScript 前端开发 iOS开发
js实用方法记录-动态加载css/js
js实用方法记录-动态加载css/js
11 0
|
6天前
|
JavaScript
【Js】检查Date对象是否为Invalid Date
【Js】检查Date对象是否为Invalid Date
9 0
|
JavaScript 前端开发
javascript中的 类初始化,遍历for in 以及with的用法
function member(name,gender){ this.name=name; this.gender=gender; } function showProperty(obj,objStr){ var str=""; for(var i in obj){ str+=objStr+".
651 0
|
2月前
|
JavaScript
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)
27 0