JS | Object.entries() 和 Object.formEntries()的用法详解

Object.entries与fromEntries详解

原创于 2025-10-18 08:30:00 发布 · 置顶 · 842 阅读

20 ·

CC 4.0 BY-SA版权

文章标签：

#entries方法 #fromEntries方法

JavaScript 专栏收录该内容

112 篇文章

订阅专栏

一、原理

1. Object.entries()

2. Object.fromEntries()

二、应用场景

1. Object.entries() 的常见用途

2. Object.fromEntries() 的常见用途

三、对比与注意事项

▼ 总结 ▼

一、原理

1. `Object.entries()`

原理：该方法返回一个由对象自身可枚举属性的键值对组成的二维数组，每个子数组形式为 [key, value]，顺序与 for...in 循环一致，但不会遍历原型链上的属性。

若输入是数组，键会被转换为字符串索引（如 ['0', 1]）。
若输入是字符串，会按字符索引生成键值对。
数字或 Symbol 类型的键会被强制转为字符串。

2. `Object.fromEntries()`

原理：作为 Object.entries() 的逆操作，它将键值对数组转换为对象。

支持接收任何可迭代对象（如 Map、自定义迭代器）。
若存在重复键，后出现的值会覆盖前者。
仅处理可枚举属性，且返回的是浅拷贝对象。

二、应用场景

1. `Object.entries()` 的常见用途

❶ 遍历对象属性：结合 map、filter 等方法处理键值对，例如，筛选或修改属性。

Object.entries(obj).map(([key, value]) => console.log(key, value));

❷ 对象转 Map：直接通过 new Map(Object.entries(obj)) 转换为 Map 结构。

❸ 处理表单数据：将表单输入项映射为键值对数组，便于批量操作。

❹ 交换键值：通过遍历修改键值对实现属性与值的交换。

const swapped = Object.fromEntries(Object.entries(obj).map(([k, v]) => [v, k]));

2. `Object.fromEntries()` 的常见用途

Map/数组转对象：将 Map 或二维数组快速转换为普通对象

const map = new Map([['a', 1], ['b', 2]]);
Object.fromEntries(map); // {a:1, b:2}

URL 查询参数解析：与 URLSearchParams 结合，将查询字符串转为对象

const params = new URLSearchParams('name=John&age=30');
const obj = Object.fromEntries(params);
console.log(params) // {size: 2}
console.log(obj) // {name: 'John', age: '30'}

数据清洗与重构：过滤或转换对象属性，例如仅保留特定字段或数值计算

// 过滤属性
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 键