目录
[1. Object.entries()](#1. Object.entries())
[2. Object.fromEntries()](#2. Object.fromEntries())
[1. Object.entries() 的常见用途](#1. Object.entries() 的常见用途)
[2. Object.fromEntries() 的常见用途](#2. Object.fromEntries() 的常见用途)
[▼ 总结 ▼](#▼ 总结 ▼)

一、原理
1. Object.entries()
原理 :该方法返回一个由对象自身可枚举属性的键值对组成的二维数组,每个子数组形式为
[key, value]
,顺序与 **for...in
**循环一致,但不会遍历原型链上的属性。
- 若输入是数组,键会被转换为字符串索引(如
['0', 1]
)。 - 若输入是字符串,会按字符索引生成键值对。
- 数字或 Symbol 类型的键会被强制转为字符串。
2. Object.fromEntries()
原理 :作为**
Object.entries()
**的逆操作,它将键值对数组转换为对象。
- 支持接收任何可迭代对象(如 Map、自定义迭代器)。
- 若存在重复键,后出现的值会覆盖前者。
- 仅处理可枚举属性,且返回的是浅拷贝对象。
二、应用场景
1. Object.entries()
的常见用途
❶ 遍历对象属性 :结合 map
、filter
等方法处理键值对,例如,筛选或修改属性。
javascript
Object.entries(obj).map(([key, value]) => console.log(key, value));
❷ 对象转 Map :直接通过 **new Map(Object.entries(obj))
**转换为 Map 结构。
❸ 处理表单数据:将表单输入项映射为键值对数组,便于批量操作。
❹ 交换键值:通过遍历修改键值对实现属性与值的交换。
javascript
const swapped = Object.fromEntries(Object.entries(obj).map(([k, v]) => [v, k]));
2. Object.fromEntries()
的常见用途
-
Map/数组转对象 :将 Map 或二维数组快速转换为普通对象
javascriptconst map = new Map([['a', 1], ['b', 2]]); Object.fromEntries(map); // {a:1, b:2}
-
URL 查询参数解析 :与
URLSearchParams
结合,将查询字符串转为对象javascriptconst params = new URLSearchParams('name=John&age=30'); const obj = Object.fromEntries(params); console.log(params) // {size: 2} console.log(obj) // {name: 'John', age: '30'}
-
数据清洗与重构 :过滤或转换对象属性,例如仅保留特定字段或数值计算
javascript// 过滤属性 const filtered = Object.fromEntries(Object.entries(obj).filter(([k]) => k !== 'id')); // 数值翻倍 const doubled = Object.fromEntries(Object.entries(obj).map(([k, v]) => [k, v * 2]));
三、对比与注意事项
特性 | Object.entries() |
Object.fromEntries() |
---|---|---|
输入类型 | 对象、数组、字符串等 | 键值对数组或可迭代对象(如 Map) |
输出类型 | 二维数组([[key, value], ...] ) |
对象 |
重复键处理 | 无(原对象属性唯一) | 后者覆盖前者 |
Symbol 键处理 | 忽略 Symbol 键 | 支持 Symbol 键 |
▼ 总结 ▼
✔ **Object.entries()
**适用于需要以数组形式操作对象属性的场景(如遍历、转换数据结构)
✔ Object.fromEntries()
擅长将键值对列表还原为对象,尤其在处理表单、URL 参数或 Map 结构时非常高效。
两者结合使用可实现对象属性的灵活转换与重构。
▼ 参考资料 ▼
JS | 对象数据的读取,看这一篇就够了!Object.keys、Object.values和Object.entries方法详解
Js中的Object.entries() 和 Object.fromEntries() | Object.entries() 用法详解 | Object.entries()
Object方法 --- Object.entries() | "键值对大逃亡:Object.entries如何带领它们奔向数组自由"
