网站站点断开,数字域名有哪些网站,中国500强企业有哪些,阿里云网站建设官方自营店文章目录 #x1f4cc; 方法 1#xff1a;使用 Array.prototype.reduce()#x1f680; 方法 2#xff1a;使用 Object.fromEntries()#xff08;ES2019#xff09;⚙️ 方法 3#xff1a;手动遍历数组⚠️ 注意事项#x1f4a1; 完整流程示例总结 数据处理过程中#… 文章目录 方法 1使用 Array.prototype.reduce() 方法 2使用 Object.fromEntries()ES2019⚙️ 方法 3手动遍历数组⚠️ 注意事项 完整流程示例总结 数据处理过程中要将一个包含 key 和 value 属性的 JSON 数组整合成一个 JSON 对象其中每个元素的 key 作为属性名value 作为属性值以下是几种常用的 JavaScript 实现方法及示例 方法 1使用 Array.prototype.reduce()
适用场景兼容性要求高支持 ES5可处理复杂逻辑如数据过滤。 代码示例
const jsonArray [{ key: name, value: Alice },{ key: age, value: 25 },{ key: city, value: Beijing }
];const jsonObject jsonArray.reduce((obj, item) {obj[item.key] item.value; // 将 key-value 对添加到对象return obj;
}, {}); // 初始化为空对象console.log(jsonObject);
// 输出{ name: Alice, age: 25, city: Beijing }说明
通过 reduce 遍历数组逐步构建对象。 方法 2使用 Object.fromEntries()ES2019
适用场景代码简洁现代浏览器或 Node.js 环境。 代码示例
const jsonArray [{ key: name, value: Bob },{ key: age, value: 30 }
];// 先将数组转换为 [key, value] 形式的二维数组
const entries jsonArray.map(item [item.key, item.value]);
const jsonObject Object.fromEntries(entries);console.log(jsonObject);
// 输出{ name: Bob, age: 30 }说明
Object.fromEntries() 直接接收键值对数组生成对象。 ⚙️ 方法 3手动遍历数组
适用场景无需高阶函数逻辑清晰易读。 代码示例
const jsonArray [{ key: id, value: 1001 },{ key: status, value: active }
];const jsonObject {};
for (const item of jsonArray) {jsonObject[item.key] item.value; // 逐项赋值
}console.log(jsonObject);
// 输出{ id: 1001, status: active }说明
通过循环直接赋值适合初学者理解。 ⚠️ 注意事项 键名冲突 若数组中有重复的 key后出现的值会覆盖先前的值。可通过检查重复键名提前处理if (obj.hasOwnProperty(item.key)) {console.warn(重复键名: ${item.key});
}空数组处理 空数组会返回空对象 {}符合预期。 复杂值类型 value 可以是任意类型对象、数组等转换时会保留结构。 JSON 字符串转换 若需将结果转为 JSON 字符串使用 JSON.stringify(jsonObject)。 完整流程示例
// 输入JSON 数组
const jsonArray [{ key: product, value: Laptop },{ key: price, value: 4999 },{ key: inStock, value: true }
];// 方法1reduce 转换
const result jsonArray.reduce((obj, item) {obj[item.key] item.value;return obj;
}, {});console.log(result);
// 输出{ product: Laptop, price: 4999, inStock: true }总结
推荐方法 现代环境 → Object.fromEntries()代码最简洁。兼容旧环境 → reduce() 或手动遍历。 关键点确保数组元素包含 key 和 value 属性且 key 需为字符串类型。
通过上述方法可高效地将结构化数组转换为易操作的 JSON 对象适用于 API 数据处理、表单提交等场景。