javascript - 对展平的对象进行排序

Question

我当前有一个对象，我想将其展平，下面的代码执行以下操作；

编辑:

刚刚更新了结构以包含优先级。

var input = {
    "a11/a22/animations": {
        "title": "title here",
        "priority": 2
    },
    "a11/a22/colours": {
        "title": "title here",
        "priority": 1
    },
    "a11/a22/fonts": {
        "title": "title here",
        "priority": 3
    },
    "a11/a22/visibility": {
        "title": "title here",
        "priority": 4
    },
    "a11/b22/logo": {
        "title": "title here",
        "priority": 1
    },
    "a11/c22/define": {
        "title": "title here",
        "priority": 2
    },
    "a11/c22/ordered": {
        "title": "title here",
        "priority": 3
    },
    "a11/c22/unordered": {
        "title": "title here",
        "priority": 1
    },
    "a11/d22/foot": {
        "title": "title here",
        "priority": 2
    },
    "a11/d22/head": {
        "title": "title here",
        "priority": 1
    },
    "a11/e22/blockquote": {
        "title": "title here",
        "priority": 2
    },
    "a11/e22/headings": {
        "title": "title here",
        "priority": 1
    },
    "a11/e22/hr": {
        "title": "title here",
        "priority": 4
    },
    "a11/e22/inline-elements": {
        "title": "title here",
        "priority": 3
    },
    "a11/e22/paragraph": {
        "title": "title here",
        "priority": 6
    },
    "a11/e22/preformatted": {
        "title": "title here",
        "priority": 5
    },
    "a11/e22/time": {
        "title": "title here",
        "priority": 7
    },
    "b11/f22/menu": {
        "title": "title here",
        "priority": 1
    },
    "b11/g22/product-item": {
        "title": "title here",
        "priority": 1
    },
    "b11/h22/search": {
        "title": "title here",
        "priority": 1
    },
    "b11/i22/sub-menu": {
        "title": "title here",
        "priority": 1
    },
    "c11/j22/footer": {
        "title": "title here",
        "priority": 1
    },
    "c11/j22/title": {
        "title": "title here",
        "priority": 2
    },
    "c11/k22/header": {
        "title": "title here",
        "priority": 1
    }
  },
  output = {};

Object.entries(input).forEach(
  ([k, v]) =>
    (k.split("/").reduce((o, k) => (o[k] = o[k] || {}), output).value = v)
);

console.log(output);

console.log(output);

.as-console-wrapper { max-height: 100% !important; top: 0; }

这使整个过程变得扁平化。但是，在值下的 json 结构中，我有一个名为 priority 的值，它是一个整数。我希望能够在第二级按优先级进行排序。 a22 和 c22，它应该根据 define、ordered 和 ordered 进行排序其下方的优先级。

.sort((a, b) => input[a].priority - input[b].priority)

预期结果:

{
  "a11": {
    "a22": {
      "colours": {
        "value": {
          "title": "title here",
          "priority": 1
        }
      },        
      "animations": {
        "value": {
          "title": "title here",
          "priority": 2
        }
      },
      "fonts": {
        "value": {
          "title": "title here",
          "priority": 3
        }
      },
      "visibility": {
        "value": {
          "title": "title here",
          "priority": 4
        }
      }
    },
    "b22": {
      "logo": {
        "value": {
          "title": "title here",
          "priority": 1
        }
      }
    },
    "c22": {
      "unordered": {
        "value": {
          "title": "title here",
          "priority": 1
        }
      },        
      "define": {
        "value": {
          "title": "title here",
          "priority": 2
        }
      },
      "ordered": {
        "value": {
          "title": "title here",
          "priority": 3
        }
      },
    },
    "d22": {
      "head": {
        "value": {
          "title": "title here",
          "priority": 1
        }
      },        
      "foot": {
        "value": {
          "title": "title here",
          "priority": 2
        }
      },
    },
    "e22": {
      "headings": {
        "value": {
          "title": "title here",
          "priority": 1
        }
      },        
      "blockquote": {
        "value": {
          "title": "title here",
          "priority": 2
        }
      },
      "inline-elements": {
        "value": {
          "title": "title here",
          "priority": 3
        }
      },      
      "hr": {
        "value": {
          "title": "title here",
          "priority": 4
        }
      },
      "preformatted": {
        "value": {
          "title": "title here",
          "priority": 5
        }
      },      
      "paragraph": {
        "value": {
          "title": "title here",
          "priority": 6
        }
      },
      "time": {
        "value": {
          "title": "title here",
          "priority": 7
        }
      }
    }
  },
  "b11": {
    "f22": {
      "menu": {
        "value": {
          "title": "title here",
          "priority": 1
        }
      }
    },
    "g22": {
      "product-item": {
        "value": {
          "title": "title here",
          "priority": 1
        }
      }
    },
    "h22": {
      "search": {
        "value": {
          "title": "title here",
          "priority": 1
        }
      }
    },
    "i22": {
      "sub-menu": {
        "value": {
          "title": "title here",
          "priority": 1
        }
      }
    }
  },
  "c11": {
    "j22": {
      "footer": {
        "value": {
          "title": "title here",
          "priority": 1
        }
      },
      "title": {
        "value": {
          "title": "title here",
          "priority": 2
        }
      }
    },
    "k22": {
      "header": {
        "value": {
          "title": "title here",
          "priority": 1
        }
      }
    }
  }
}

Answer 1

您可以在生成新对象之前对条目进行排序，方法是采用优先级并按升序对项目进行排序。

var input = { "a11/a22/animations": { title: "title here", priority: 2 }, "a11/a22/colours": { title: "title here", priority: 1 }, "a11/a22/fonts": { title: "title here", priority: 3 }, "a11/a22/visibility": { title: "title here", priority: 4 }, "a11/b22/logo": { title: "title here", priority: 1 }, "a11/c22/define": { title: "title here", priority: 2 }, "a11/c22/ordered": { title: "title here", priority: 3 }, "a11/c22/unordered": { title: "title here", priority: 1 }, "a11/d22/foot": { title: "title here", priority: 2 }, "a11/d22/head": { title: "title here", priority: 1 }, "a11/e22/blockquote": { title: "title here", priority: 2 }, "a11/e22/headings": { title: "title here", priority: 1 }, "a11/e22/hr": { title: "title here", priority: 4 }, "a11/e22/inline-elements": { title: "title here", priority: 3 }, "a11/e22/paragraph": { title: "title here", priority: 6 }, "a11/e22/preformatted": { title: "title here", priority: 5 }, "a11/e22/time": { title: "title here", priority: 7 }, "b11/f22/menu": { title: "title here", priority: 1 }, "b11/g22/product-item": { title: "title here", priority: 1 }, "b11/h22/search": { title: "title here", priority: 1 }, "b11/i22/sub-menu": { title: "title here", priority: 1 }, "c11/j22/footer": { title: "title here", priority: 1 }, "c11/j22/title": { title: "title here", priority: 2 }, "c11/k22/header": { title: "title here", priority: 1 } },
    output = {};

Object
    .entries(input)
    .sort(({ 1: { priority: a } }, { 1: { priority: b } }) => a - b)
    .forEach(([k, v]) => (k.split("/").reduce((o, k) => (o[k] = o[k] || {}), output).value = v)
);

console.log(output);

.as-console-wrapper { max-height: 100% !important; top: 0; }