JavaScript 对象遍历方法及其遍历顺序的总结

全栈程序员-站长 • 2026年3月26日下午5:22 • 未分类 • 阅读 1

JavaScript 对象遍历方法及其遍历顺序的总结

0.从规范中定义的内部 ownPropertyKeys 方法说起

这个方法定义了一个对象的遍历顺序：

先将 整数属性 按升序排列。
再将 字符串属性 按 定义顺序 排列。
最后将 Symbol 符号属性 按 定义顺序 排列。

其中，整数属性的定义为：

+0 <= parseFloat(key) < 2^32 – 1 (最大安全整数)
不作任何修改便可以与一个整数值相互转换

alert( String(Math.trunc(Number("49"))) ); // "49"，相同，整数属性 alert( String(Math.trunc(Number("+49"))) ); // "49"，不同于 "+49" ⇒ 不是整数属性 alert( String(Math.trunc(Number("1.2"))) ); // "1"，不同于 "1.2" ⇒ 不是整数属性

这个遍历顺序广泛地应用在了各种遍历方式之中。

1.使用 ownPropertyKeys 遍历顺序的方法

Object.getOwnPropertyNames()

获取所有实例字符串属性的字符串数组。
忽略 Symbol 属性。
无论是否可枚举都会被获取。

Object.getOwnPropertySymbols()

获取所有实例符号（Symbol）属性的数组。
返回结果只有符号属性。
无论是否可枚举都会被获取。

Object.assign()

使用方法： Object.assign(目标对象，一个或多个源对象)
作用：将源对象上的属性复制到目标对象上，并将目标对象的引用返回。
被复制的对象：实例上所有的可枚举属性。
Object.propertyIsEnumerable() === true &&
Object.hasOwnProperty() === true

Reflect.ownKeys()

获取所有 实例属性 的数组。
返回结果有字符串属性和符号属性。
无论是否可枚举都会被获取。
相当于Object.getOwnPropertyNames(target).concat(Object.getOwnPropertySymbols(target))

示例：

定义一个 obj 对象：

let s = Symbol("1"); let s2 = Symbol("2"); let obj = { 
     '1e':"1", '0':"2", '+5':"3", [s2]:"3.5", '2':"4", '2haha':"5", [s]:"6", }

使用下列方式遍历：

console.log(Object.getOwnPropertyNames(obj)) //["0","2","1e","+5","2haha"] console.log(Object.getOwnPropertySymbols(obj)) //[Symbol(2),Symbol(1)] console.log(Reflect.ownKeys(obj)); //["0","2","1e","+5","2haha",Symbol(2),Symbol(1)] console.log(Object.assign({ 
    },obj)); /* { "0":"2", "2":"4", "1e":"1", "+5":"3", "2haha":"5" } */

在这里插入图片描述

2.For…of

for…of 可以遍历可迭代对象，即实现了 Symbol.iterator 方法的对象。

2.1 遍历的顺序

遍历的顺序为调用 Symbol.iterator 工厂方法返回的迭代器中， next() 方法的返回值顺序。

3.For…in

3.1 遍历的范围

▲ for…in 方法可以遍历对象 实例上 的及 原型链上 的所有 可枚举属性（[[Enumerable]]: true）。
▲ 忽略 Symbol 属性。
▲ 对 null / undefined 遍历将不会执行循环体。

3.2 遍历的顺序

for…in 方法遍历的顺序在不同浏览器 JavaScript 引擎中表现不一。

3.2.1 在 Chrome / Opera 中

遵循上述的 ownPropertyKeys 方法 的顺序排列。

for(let k in obj){ 
       console.log(k); }

在这里插入图片描述

3.2.2 在其他浏览器中

按照属性定义的顺序排列。

4.Object.keys()

4.1 遍历的范围

▲ Object.keys() 方法可以遍历对象 实例上 的所有 可枚举属性。
▲ 忽略 Symbol 属性。
▲ 参数为 null / undefined 时会抛出错误。
Uncaught TypeError: Cannot convert undefined or null to object

4.2 遍历的顺序

console.log(Object.keys(obj)); //["0","2","1e","+5","2haha"]

在这里插入图片描述

参考文章

发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/178407.html原文链接：https://javaforall.net

JavaScript 对象遍历方法及其遍历顺序的总结