javascript对象如何遍历所有属性-js教程-PHP中文网

javascript对象如何遍历所有属性

月夜之吻

发布： 2025-08-12 09:14:01

原创

559人浏览过

javascript对象遍历属性主要用for...in循环配合hasownproperty()过滤继承属性；1. for...in结合hasownproperty()可遍历自身可枚举属性；2. object.keys()返回自身可枚举属性数组，适合foreach遍历；3. object.getownpropertynames()返回所有自身属性（含不可枚举）；4. reflect.ownkeys()返回所有自身属性，包括symbol和不可枚举属性；需根据是否可枚举、是否继承、是否包含symbol等需求选择方法，避免误遍历原型链属性。

javascript对象如何遍历所有属性

直接告诉你：JavaScript 对象遍历所有属性，主要用

for...in

登录后复制

循环，配合

hasOwnProperty()

登录后复制

方法过滤掉继承来的属性。当然，

Object.keys()

登录后复制

、

Object.getOwnPropertyNames()

登录后复制

也能派上用场，各有千秋。

解决方案：

用

for...in

登录后复制

循环遍历对象属性，并用

hasOwnProperty()

登录后复制

检查属性是否是对象自身的。

立即学习“Java免费学习笔记（深入）”；

const myObject = {
  a: 1,
  b: 2,
  c: 3
};

for (let key in myObject) {
  if (myObject.hasOwnProperty(key)) {
    console.log(`属性: ${key}, 值: ${myObject[key]}`);
  }
}

登录后复制

Object.keys()

登录后复制

返回一个包含对象所有自身可枚举属性名称的数组，然后用

forEach

登录后复制

或者

for

登录后复制

循环遍历。

const keys = Object.keys(myObject);

keys.forEach(key => {
  console.log(`属性: ${key}, 值: ${myObject[key]}`);
});

登录后复制

Object.getOwnPropertyNames()

登录后复制

返回一个包含对象所有自身属性（包括不可枚举属性）名称的数组。这方法比较彻底，啥都能拿到。

const propertyNames = Object.getOwnPropertyNames(myObject);

propertyNames.forEach(propertyName => {
  console.log(`属性: ${propertyName}, 值: ${myObject[propertyName]}`);
});

登录后复制

Reflect.ownKeys()

登录后复制

，它会返回一个数组，包含对象自身的所有属性，不管是不是可枚举的，也不管是不是 Symbol 类型的。

移动端UI&微信UI YDUI Touch

YDUI Touch专为移动端打造，在技术实现、交互设计上兼容主流移动设备，保证代码轻、性能高；使用 Flexbox 技术，灵活自如地对齐、收缩、扩展元素，轻松搞定移动页面布局；用 rem 实现强大的屏幕适配布局，等比例适配所有屏幕；自定义Javascript组件、Less文件、Less变量，定制一份属于自己的YDUI。

查看详情

const allKeys = Reflect.ownKeys(myObject);

allKeys.forEach(key => {
  console.log(`属性: ${key}, 值: ${myObject[key]}`);
});

登录后复制

为什么要用

hasOwnProperty()

登录后复制

过滤继承属性？

JavaScript 里，对象是通过原型链继承属性的。不用

hasOwnProperty()

登录后复制

，

for...in

登录后复制

循环会把原型链上继承来的属性也给你遍历出来，这通常不是我们想要的。例如：

Object.prototype.inheritedProperty = function() {
  console.log("我是继承来的属性");
};

const myObject = {
  a: 1,
  b: 2
};

for (let key in myObject) {
  console.log(key); // 输出 a, b, inheritedProperty
}

for (let key in myObject) {
  if (myObject.hasOwnProperty(key)) {
    console.log(key); // 只输出 a, b
  }
}

登录后复制

所以，为了只关注对象自身的属性，

hasOwnProperty()

登录后复制

是个好帮手。

Object.keys()

登录后复制

和

Object.getOwnPropertyNames()

登录后复制

有什么区别？

Object.keys()

登录后复制

只返回可枚举的自身属性，而

Object.getOwnPropertyNames()

登录后复制

返回所有自身属性，包括不可枚举的。啥叫可枚举？简单来说，就是能不能被

for...in

登录后复制

循环遍历出来。举个例子：

const myObject = {};

Object.defineProperty(myObject, 'a', {
  value: 1,
  enumerable: true // 可枚举
});

Object.defineProperty(myObject, 'b', {
  value: 2,
  enumerable: false // 不可枚举
});

console.log(Object.keys(myObject)); // 输出 ["a"]
console.log(Object.getOwnPropertyNames(myObject)); // 输出 ["a", "b"]

登录后复制

什么时候应该用哪种遍历方法？

只需要可枚举的自身属性： 用
```
for...in
```
登录后复制
循环 +
```
hasOwnProperty()
```
登录后复制
或者
```
Object.keys()
```
登录后复制
。
需要所有自身属性（包括不可枚举的）： 用
```
Object.getOwnPropertyNames()
```
登录后复制
或者
```
Reflect.ownKeys()
```
登录后复制
。
需要考虑 Symbol 类型的属性： 只能用
```
Reflect.ownKeys()
```
登录后复制
，因为它能拿到所有类型的属性。