如何将含斜杠分隔键的扁平对象转换为嵌套对象？

需求说明 #

我需要把如下的扁平对象：

{
    "Base/Brand/0101-color-brand-primary-red": "#fe414d",
    "Base/Brand/0106-color-brand-secondary-green": "#00e6c3",
    "Base/Brand/0102-color-brand-primary-light-gray": "#eaecf0",
    "Base/Brand/0107-color-brand-secondary-black": "#000000",
    "Base/Brand/0103-color-brand-primary-white": "#ffffff",
    "Base/Brand/0108-color-brand-secondary-dark-gray": "#b4b4b4",
    "Base/Brand/0104-color-brand-secondary-blue": "#079fff",
    "Base/Light/Extended/Red/0201-color-extended-900-red": "#7f1d1d",
    "Base/Brand/0105-color-brand-secondary-yellow": "#ffe63b",
    "Base/Light/Extended/Red/0202-color-extended-800-red": "#991b1b"
}

转换为按斜杠拆分键后的嵌套对象结构（注：原示例嵌套层级有误，以下为正确的目标结构）：

{
  "Base": {
    "Brand": {
      "0101-color-brand-primary-red": "#fe414d",
      "0106-color-brand-secondary-green": "#00e6c3",
      "0102-color-brand-primary-light-gray": "#eaecf0",
      "0107-color-brand-secondary-black": "#000000",
      "0103-color-brand-primary-white": "#ffffff",
      "0108-color-brand-secondary-dark-gray": "#b4b4b4",
      "0104-color-brand-secondary-blue": "#079fff",
      "0105-color-brand-secondary-yellow": "#ffe63b"
    },
    "Light": {
      "Extended": {
        "Red": {
          "0201-color-extended-900-red": "#7f1d1d",
          "0202-color-extended-800-red": "#991b1b"
        }
      }
    }
  }
}

实现思路（以JavaScript为例） #

核心逻辑是遍历扁平对象的每个键，按斜杠/拆分路径，逐层构建嵌套对象：

• 初始化空对象作为嵌套结构的根节点
• 遍历原对象的每一组键值对，将键拆分为路径片段数组
• 从根节点开始，沿着路径片段逐层创建嵌套对象（不存在则新建）
• 到达路径最后一段时，将对应的值赋值给该节点

完整实现代码 #

function flattenToNested(flatObj) {
  const nestedObj = {};
  
  // 遍历扁平对象的所有键值对
  for (const [key, value] of Object.entries(flatObj)) {
    // 拆分键为路径片段数组
    const pathSegments = key.split('/');
    let current = nestedObj;
    
    // 逐层构建嵌套结构
    for (let i = 0; i < pathSegments.length; i++) {
      const segment = pathSegments[i];
      // 最后一个片段直接赋值
      if (i === pathSegments.length - 1) {
        current[segment] = value;
      } else {
        // 当前层级不存在则初始化空对象
        if (!current[segment]) {
          current[segment] = {};
        }
        // 移动到下一层级
        current = current[segment];
      }
    }
  }
  
  return nestedObj;
}

// 测试用例
const flatObject = {
    "Base/Brand/0101-color-brand-primary-red": "#fe414d",
    "Base/Brand/0106-color-brand-secondary-green": "#00e6c3",
    "Base/Brand/0102-color-brand-primary-light-gray": "#eaecf0",
    "Base/Brand/0107-color-brand-secondary-black": "#000000",
    "Base/Brand/0103-color-brand-primary-white": "#ffffff",
    "Base/Brand/0108-color-brand-secondary-dark-gray": "#b4b4b4",
    "Base/Brand/0104-color-brand-secondary-blue": "#079fff",
    "Base/Light/Extended/Red/0201-color-extended-900-red": "#7f1d1d",
    "Base/Brand/0105-color-brand-secondary-yellow": "#ffe63b",
    "Base/Light/Extended/Red/0202-color-extended-800-red": "#991b1b"
};

const nestedResult = flattenToNested(flatObject);
console.log(JSON.stringify(nestedResult, null, 2));

代码说明 #

• Object.entries(flatObj)：将扁平对象转为键值对数组，便于遍历
• key.split('/')：将带斜杠的键拆分为可遍历的路径片段
• 通过current变量跟踪当前嵌套层级，确保每一层对象都被正确创建和赋值

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