javascript - convert list of slugs into json in Javascript

Question

I am looking for a javascript function or npm package, which converts list of slugs into a json.

for example this is an input:

const data = [
  "/docs/faq.md",
  "/docs/index.md",
  "/docs/what.md",
  "/docs/Tutorials/how-to-buy.md",
  "/docs/Tutorials/how-to-store.md",
  "/docs/guide.md",
  "/docs/Tutorials/analysis.md",
  "/docs/Tutorials/index.md",
  "/docs/Tutorials/tutorial.md",
  "/docs/Tutorials/understanding.md",
  "/docs/start.md",
];

and this should be the output:

const output = {
    docs: {
        children: [
          { title: "index.md" },
          { title: "faq.md" },
          { title: "what.md" },
          {
            Tutorials: {
              children: [
                { title: "index.md" },
                { title: "how-to-buy.md" },
                { title: "how-to-store.md" },
                { title: "analysis.md" },
                { title: "tutorial.md" },
                { title: "understanding.md" },
              ],
            },
          },
          { title: "guide.md" },
          { title: "start.md" },
        ],
      },
};

another example:

const data = [
  "faq.md",
  "index.md",
  "/docs/what.md",
  "/docs/Tutorials/how-to-buy.md",
  "/docs/Tutorials/how-to-store.md",
  "/docs/guide.md",
  "/docs/Tutorials/analysis.md",
  "/docs/Tutorials/index.md",
  "/docs/Tutorials/tutorial.md",
  "/docs/Tutorials/understanding.md",
  "/docs/start.md",
];

and output:

const output = {
  children: [
    { title: "index.md" },
    { title: "faq.md" },
    {
      docs: {
        children: [
          { title: "what.md" },
          {
            Tutorials: {
              children: [
                { title: "index.md" },
                { title: "how-to-buy.md" },
                { title: "how-to-store.md" },
                { title: "analysis.md" },
                { title: "tutorial.md" },
                { title: "understanding.md" },
              ],
            },
          },
          { title: "guide.md" },
          { title: "start.md" },
        ],
      },
    },
  ],
};

I am not sure if a similar solution is available on Github or npm.

标签： javascript

Answer 1

Loop your array, split on / and then just put elements in it's places:

const data = [
  "/root-node.md",
  "/docs/faq.md",
  "/docs/index.md",
  "/docs/what.md",
  "/docs/Tutorials/how-to-buy.md",
  "/docs/Tutorials/how-to-store.md",
  "/docs/guide.md",
  "/docs/Tutorials/analysis.md",
  "/docs/Tutorials/index.md",
  "/docs/Tutorials/tutorial.md",
  "/docs/Tutorials/understanding.md",
  "/docs/start.md",
];

var output = [];

for (var i = 0; i < data.length; i++) {
  let parts = data[i].split('/');

  let current = output;
  
  for (var j = 1; j < parts.length - 1; j++) {
    let found = false;

    for (var k = 0; k < current.length; k++) {
      if (typeof current[k][parts[j]] !== 'undefined') {
        found = true;
        current = current[k][parts[j]];
        
        break;
      }
    }
    
    if (!found) {
      let newRow = {}
      newRow[parts[j]] = []
      current.push(newRow)
      current = current[current.length - 1][parts[j]];
    }
  }
  
  current.push({title: parts[parts.length - 1]});
}

console.log(output)