Node.js如何动态替换JSON值？基于React传入的映射对象

核心逻辑 #

通过递归遍历目标JSON的所有层级，自动识别所有以value_为前缀的字符串值，将其替换为映射对象中对应键的内容。无需硬编码任何字段，完全适配动态变化的JSON结构。

实现代码 #

function replaceValuePlaceholders(targetObj, mapObj, options = { keepMissing: false }) {
  // 处理基本类型（非对象/数组）
  if (typeof targetObj !== 'object' || targetObj === null) {
    return targetObj;
  }

  // 处理数组：递归遍历每个元素
  if (Array.isArray(targetObj)) {
    return targetObj.map(item => replaceValuePlaceholders(item, mapObj, options));
  }

  // 处理对象：遍历所有键值对，递归处理值
  const result = {};
  for (const [key, value] of Object.entries(targetObj)) {
    let processedValue = replaceValuePlaceholders(value, mapObj, options);
    
    // 匹配并替换value_*格式的占位符
    if (typeof processedValue === 'string' && processedValue.startsWith('value_')) {
      const mapKey = processedValue.slice(6); // 截取value_之后的部分作为映射键
      // 优先取映射对象的值，无匹配时根据配置决定保留原占位符还是设为null
      processedValue = mapObj.hasOwnProperty(mapKey) 
        ? mapObj[mapKey] 
        : options.keepMissing ? processedValue : null;
    }

    result[key] = processedValue;
  }

  return result;
}

使用示例 #

// 动态变化的目标JSON
const jsonObj = {
  userInfo: {
    nickName: "value_nick",
    contact: {
      email: "value_email",
      phone: "value_phone"
    },
    hobbies: ["value_hobby1", "value_hobby2", "coding"]
  },
  pageConfig: {
    title: "value_pageTitle",
    showFooter: true
  }
};

// 前端传入的映射对象
const Obj1 = {
  nick: "技术宅",
  email: "dev@example.com",
  phone: "138xxxx1234",
  hobby1: "爬山",
  hobby2: "摄影",
  pageTitle: "个人中心"
};

// 执行替换（默认无匹配时设为null）
const replacedResult = replaceValuePlaceholders(jsonObj, Obj1);
console.log(replacedResult);

替换后的输出：

{
  userInfo: {
    nickName: "技术宅",
    contact: {
      email: "dev@example.com",
      phone: "138xxxx1234"
    },
    hobbies: ["爬山", "摄影", "coding"]
  },
  pageConfig: {
    title: "个人中心",
    showFooter: true
  }
}

关键特性 #

• 完全动态适配：不管目标JSON的层级、字段如何变化，无需修改函数代码
• 纯函数设计：不修改原JSON对象，返回全新的替换后对象，避免副作用
• 灵活配置：通过keepMissing参数控制无匹配键时的行为（保留原占位符或设为null）
• 支持多种类型：兼容嵌套对象、数组，仅处理字符串类型的value_*占位符，其他类型（数字、布尔、null）保持原样

内容的提问来源于stack exchange，提问作者HDNMH