CODEWITHSUNDEEP
javascript
reacg garav
reacg garav

Reputation: 535

How to map paths to the extreme deep props of an object in to a new object with some additional props?

How to map paths of the following object in to a new object with path to access the deeply nested property & add some other properties along with them.

    const obj = {
      key1: { level1: { level2: { prop1: {}, prop5: {} } } },
      key2: { level1: { level2: { prop2: {} } } },
      key3: { level1: { prop3: {}, prop6: {}, prop7: {} } },
      key4: { level1: { level2: { level3: { prop4: {} } } } },
    };

In to this:

    const expectedObj = {
      key1Level1Level2Prop1: { path: "key1.level1.level2.prop1", name: "Prop 1", id: (Math.random() * 1000000).toFixed(0) },
      key2Level1Level2Prop2: { path: "key2.level1.level2.prop2", name: "Prop 2", id: (Math.random() * 1000000).toFixed(0) },
      key3Level1Prop3: { path: "key3.level1.prop3", name: "Prop 3", id: (Math.random() * 1000000).toFixed(0) },
      key4Level1Level2Level3Prop4: { path: "key4.level1.level2.level3.prop4", name: "Prop 4", id: (Math.random() * 1000000).toFixed(0) },
      key1Level1Level2Prop5: { path: "key1.level1.level2.prop5", name: "Prop 5", id: (Math.random() * 1000000).toFixed(0) },
      key3Level1Prop6: { path: "key3.level1.prop6", name: "Prop 6", id: (Math.random() * 1000000).toFixed(0) },
      key3:evel1Prop7: { path: "key3.level1.prop7", name: "Prop 7", id: (Math.random() * 1000000).toFixed(0) },
    };

Note that all the props at the extreme ends are mapped in here i.e. e.g. prop1 is at the extreme deep level of key1, so that this is mapped in the expectedObj as prop1: {path: ...}.

So all the extreme deep props (which are empty objects) should be mapped in the expected result.

Note that all the props at the extreme ends of each levels are empty objects {}

Upvotes: 3

Views: 37

Answers (1)

blex
blex

Reputation: 25659

You could use recursion:

const obj = {
  key1: { level1: { level2: { prop1: {}, prop5: {} } } },
  key2: { level1: { level2: { prop2: {} } } },
  key3: { level1: { prop3: {}, prop6: {}, prop7: {} } },
  key4: { level1: { level2: { level3: { prop4: {} } } } },
};

function findExtremeNodes(obj) {
  return Object.entries(obj).reduce((res, [k, v]) => {
    if(!Object.keys(v).length) { // Extreme node
      res[k] = { path: k, name: capitalizedAndSpaced(k), id: getRandomId() };
    } else { // Subtree
      Object.entries(findExtremeNodes(v)).forEach(([k2, v2]) => {
        res[k + capitalize(k2)] = { ...v2, path: k + '.' + v2.path };
      });
    }
    return res;
  }, {});
}

function capitalizedAndSpaced(str) {
  return str.match(/[a-z]+|[^a-z]+/gi).map(capitalize).join(' ');
}

function capitalize(str) {
  return str[0].toUpperCase() + str.slice(1);
}

function getRandomId() {
  return (Math.random() * 1000000).toFixed(0);
}

const res = findExtremeNodes(obj);
document.body.innerHTML = '<pre>' + JSON.stringify(res, 0, 4) + '</pre>';

Upvotes: 1

Related Questions