js怎么把两个json拼在一起

JavaScript中合并两个JSON对象的实用方法

在JavaScript开发中，经常需要将两个或多个JSON对象合并成一个对象，无论是处理API响应、配置对象还是数据聚合，合并JSON对象都是一项常见任务，本文将介绍几种在JavaScript中合并两个JSON对象的方法，从基础到高级,帮助你选择最适合的场景解决方案。

使用Object.assign()

Object.assign()是ES6引入的一个静态方法，用于将所有可枚举的自身属性从一个或多个源对象复制到目标对象,这是合并JSON对象最直接的方法之一。

const json1 = { a: 1, b: 2 };
const json2 = { b: 3, c: 4 };
const merged = Object.assign({}, json1, json2);
console.log(merged); // 输出: { a: 1, b: 3, c: 4 }

注意事项：

如果两个对象有相同的属性名，后面的对象会覆盖前面的值
第一个参数是目标对象，通常传入一个空对象{}以避免修改原始对象
浅拷贝：对于嵌套对象，只复制引用而非实际值

使用展开运算符(...)

ES6的展开运算符提供了一种更简洁的语法来合并对象：

const json1 = { a: 1, b: 2 };
const json2 = { b: 3, c: 4 };
const merged = { ...json1, ...json2 };
console.log(merged); // 输出: { a: 1, b: 3, c: 4 }

优点：

语法简洁直观
同样遵循后出现的对象属性覆盖前面的原则
同样是浅拷贝

使用Lodash的merge()方法

对于需要深度合并（合并嵌套对象）的场景，Lodash库的merge()方法非常实用：

const _ = require('lodash');
const json1 = { a: 1, b: { x: 10, y: 20 } };
const json2 = { b: { y: 30, z: 40 }, c: 3 };
const merged = _.merge({}, json1, json2);
console.log(merged);
// 输出: { a: 1, b: { x: 10, y: 30, z: 40 }, c: 3 }

特点：

深度合并，递归合并嵌套对象
遇到相同属性时，会将值合并而不是简单覆盖
需要引入Lodash库

手动合并函数

如果你不想依赖外部库,也可以编写一个自定义的合并函数：

function deepMerge(target, source) {
  const output = Object.assign({}, target);
  if (isObject(target) && isObject(source)) {
    Object.keys(source).forEach(key => {
      if (isObject(source[key])) {
        if (!(key in target))
          Object.assign(output, { [key]: source[key] });
        else
          output[key] = deepMerge(target[key], source[key]);
      } else {
        Object.assign(output, { [key]: source[key] });
      }
    });
  }
  return output;
}
function isObject(item) {
  return item && typeof item === 'object' && !Array.isArray(item);
}
const json1 = { a: 1, b: { x: 10, y: 20 } };
const json2 = { b: { y: 30, z: 40 }, c: 3 };
const merged = deepMerge(json1, json2);
console.log(merged);
// 输出: { a: 1, b: { x: 10, y: 30, z: 40 }, c: 3 }

使用JSON.parse和JSON.stringify（不推荐）

虽然这种方法可以合并对象,但效率低下且不推荐使用：

const json1 = { a: 1, b: 2 };
const json2 = { b: 3, c: 4 };
const merged = JSON.parse(JSON.stringify({ ...json1, ...json2 }));
console.log(merged); // 输出: { a: 1, b: 3, c: 4 }

缺点：

性能差，涉及序列化和反序列化
会丢失函数、undefined等非JSON安全值
代码冗余

选择合适的方法

方法	浅拷贝/深拷贝	代码简洁性	适用场景
Object.assign()	浅拷贝	中等	简单对象合并
展开运算符	浅拷贝	高	简单对象合并
Lodash merge()	深拷贝	中等	复杂嵌套对象合并
自定义函数	可定制	低	需要特殊合并逻辑
JSON方法	浅拷贝	低	不推荐