JavaScript中如何遍历对象_forin和Object.keys区别

21次阅读

for…in 遍历对象自身及原型链上所有可枚举字符串键属性,Object.keys() 仅返回自身可枚举字符串键组成的数组,不包含继承属性,更安全可控。

JavaScript中如何遍历对象_forin和Object.keys区别

遍历 javaScript 对象时,for...inObject.keys() 都能拿到属性名,但它们的行为、范围和适用场景有本质区别——关键在于是否包含**原型链上的可枚举属性**,以及返回值类型不同。

for…in:遍历所有可枚举属性(含继承的)

for...in 会遍历对象自身及其原型链上所有**可枚举(enumerable: true)的字符串键属性**。这意味着它可能拿到你没定义在当前对象上、而是从父类或 Object.prototype 继承来的属性。

  • 不区分属性来源,只要可枚举就进循环
  • 遍历顺序不保证(ES2015+ 对数字键有部分排序,但一般键仍无序)
  • 需手动用 hasOwnProperty() 过滤掉继承属性,否则容易出错

例如:

const parent = { a: 1 }; const obj = Object.create(parent); obj.b = 2; obj.c = 3;  for (let key in obj) {   console.log(key); // 输出 'b', 'c', 'a'(a 来自原型) }

Object.keys():只取对象自身的可枚举属性名

Object.keys(obj) 返回一个**纯数组**,里面只有对象自身拥有的、可枚举的字符串键(不含 symbol 键,也不含原型链上的)。

JavaScript中如何遍历对象_forin和Object.keys区别

Veo

Google 最新发布的 AI 视频生成模型

JavaScript中如何遍历对象_forin和Object.keys区别 567

查看详情 JavaScript中如何遍历对象_forin和Object.keys区别

立即学习Java免费学习笔记(深入)”;

  • 结果是数组,天然支持 mapFilterforeach 等数组方法
  • 不访问原型链,更安全,也更符合“只处理我定义的属性”这种直觉
  • 返回的是字符串数组,不能直接遍历 Symbol 属性(要用 Object.getOwnPropertySymbols()

例如:

console.log(Object.keys(obj)); // ['b', 'c'],不包含 'a' Object.keys(obj).forEach(key => console.log(key)); // 只输出 b、c

其他常见方式对比(简要)

  • Object.getOwnPropertyNames():返回自身所有字符串键(包括不可枚举的,如 toString 的属性描述符设为 enumerable: false 时仍会被包含)
  • Reflect.ownKeys():返回自身所有键,含字符串 + Symbol,且保持定义顺序(ES2015+)
  • for...of + Object.keys():结合两者优势,写法更现代,但本质还是靠 Object.keys() 提供数组

怎么选?看需求

  • 想只处理当前对象定义的属性 → 用 Object.keys()Reflect.ownKeys()
  • 真需要检查整个原型链(极少见,比如做调试工具)→ 用 for...in,但务必加 hasOwnProperty 判断
  • 需要遍历 Symbol 属性 → 必须用 Object.getOwnPropertySymbols()Reflect.ownKeys()
  • 想一行写完且逻辑清晰 → 推荐 Object.keys(obj).forEach(...)

基本上就这些。日常开发中,Object.keys() 更安全、更可控;而 for...in 容易踩坑,除非你明确知道为什么需要它。

以上就是javascript中如何遍历对象_forin和Object.keys

text=ZqhQzanResources