w3resource

JavaScript: Flatten an object with the paths for keys

JavaScript fundamental (ES6 Syntax): Exercise-233 with Solution

Write a JavaScript program to flatten an object with the paths for keys.

  • Use recursion.
  • Use Object.keys(obj) combined with Array.prototype.reduce() to convert every leaf node to a flattened path node.
  • If the value of a key is an object, the function calls itself with the appropriate prefix to create the path using Object.assign().
  • Otherwise, it adds the appropriate prefixed key-value pair to the accumulator object.
    • You should always omit the second argument, prefix, unless you want every key to have a prefix.

Sample Solution:

JavaScript Code:

//#Source https://bit.ly/2neWfJ2 
const flattenObject = (obj, prefix = '') =>
  Object.keys(obj).reduce((acc, k) => {
    const pre = prefix.length ? prefix + '.' : '';
    if (typeof obj[k] === 'object') Object.assign(acc, flattenObject(obj[k], pre + k));
    else acc[pre + k] = obj[k];
    return acc;
  }, {});
console.log(flattenObject({ a: { b: { c: 1 } }, d: 1 }));

Sample Output:

{"a.b.c":1,"d":1}

Flowchart:

flowchart: Flatten an object with the paths for keys.

Live Demo:

See the Pen javascript-basic-exercise-233-1 by w3resource (@w3resource) on CodePen.


Improve this sample solution and post your code through Disqus

Previous: Write a JavaScript program that takes a function as an argument, then makes the first argument the last.
Next: Write a JavaScript program to flatten a given array up to the specified depth.

What is the difficulty level of this exercise?

Test your Programming skills with w3resource's quiz.



Follow us on Facebook and Twitter for latest update.

JavaScript: Tips of the Day

Randomizes the order of the values of an array, returning a new array

Example:

const tips_shuffle = ([...arr]) => {
  let x = arr.length;
  while (x) {
    const i = Math.floor(Math.random() * x--);
    [arr[x], arr[i]] = [arr[i], arr[x]];
  }
  return arr;
};
const foo = [2, 4, 6];
console.log(tips_shuffle(foo));

Output:

[4, 2, 6]

 

We are closing our Disqus commenting system for some maintenanace issues. You may write to us at reach[at]yahoo[dot]com or visit us at Facebook