JavaScript中如何按键的层级标识将扁平对象转换为嵌套结构

你可以通过两种方式实现这个转换：既可以用成熟的工具库快速实现，也可以自己写原生JS函数完成。

方案1：用Lodash库快速实现 #

Lodash提供的_.set()方法天然支持按照路径设置嵌套对象的值，你只需要把原始key里的:``.两种分隔符统一拆分成路径数组即可，代码示例如下：

// 引入lodash
const _ = require('lodash');

function transformObj(originObj) {
  const result = {
    pageId: originObj.pageId,
    answer: {}
  };
  // 遍历answer的所有键值对
  Object.entries(originObj.answer).forEach(([key, value]) => {
    // 处理key为null的特殊映射
    let processedKey = key === 'null' ? 'PaymentsToIncuCode' : key;
    // 按:或者.拆分路径
    const pathArr = processedKey.split(/[:.]/);
    // 把值设置到对应路径
    _.set(result.answer, pathArr, value);
  });
  return result;
}

注：你提供的目标结构示例漏了原始数据里的paymentMethod:Paypal:PaypalUsageCode对应的节点，上述代码执行后会自动生成paymentMethod.Paypal.PaypalUsageCode = ["2"]的结构，符合层级拆分规则。

方案2：原生JS实现（无需引入第三方库） #

如果你不想引入第三方依赖，可以用下面的原生函数实现相同的效果：

function setNestedValue(obj, pathArr, value) {
  let current = obj;
  // 遍历路径，逐层创建对象
  for (let i = 0; i < pathArr.length; i++) {
    const key = pathArr[i];
    // 最后一层直接赋值
    if (i === pathArr.length - 1) {
      current[key] = value;
      break;
    }
    // 中间层如果不存在就初始化空对象
    if (!current[key]) {
      current[key] = {};
    }
    current = current[key];
  }
}

function transformObj(originObj) {
  const result = {
    pageId: originObj.pageId,
    answer: {}
  };
  Object.entries(originObj.answer).forEach(([key, value]) => {
    let processedKey = key === 'null' ? 'PaymentsToIncuCode' : key;
    const pathArr = processedKey.split(/[:.]/);
    setNestedValue(result.answer, pathArr, value);
  });
  return result;
}

两种方案执行后得到的结构都和你给出的期望格式匹配，如果需要把mobileWalletCodes下的数字索引转成真正的数组而不是对象，只需要额外加一层判断：如果key是纯数字，就把父节点初始化为数组即可。

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