
- Javascript Basics Tutorial
- Javascript - Home
- Javascript - Overview
- Javascript - Syntax
- Javascript - Enabling
- Javascript - Placement
- Javascript - Variables
- Javascript - Operators
- Javascript - If...Else
- Javascript - Switch Case
- Javascript - While Loop
- Javascript - For Loop
- Javascript - For...in
- Javascript - Loop Control
- Javascript - Functions
- Javascript - Events
- Javascript - Cookies
- Javascript - Page Redirect
- Javascript - Dialog Boxes
- Javascript - Void Keyword
- Javascript - Page Printing
- JavaScript Objects
- Javascript - Objects
- Javascript - Number
- Javascript - Boolean
- Javascript - Strings
- Javascript - Arrays
- Javascript - Date
- Javascript - Math
- Javascript - RegExp
- Javascript - HTML DOM
- JavaScript Advanced
- Javascript - Error Handling
- Javascript - Validations
- Javascript - Animation
- Javascript - Multimedia
- Javascript - Debugging
- Javascript - Image Map
- Javascript - Browsers
- JavaScript Useful Resources
- Javascript - Questions And Answers
- Javascript - Quick Guide
- Javascript - Functions
- Javascript - Resources
How to unflatten a JavaScript object in a daisy-chain/dot notation into an object with nested objects and arrays?
Suppose, we have an object like this −
const obj = { "firstName": "John", "lastName": "Green", "car.make": "Honda", "car.model": "Civic", "car.revisions.0.miles": 10150, "car.revisions.0.code": "REV01", "car.revisions.0.changes": "", "car.revisions.1.miles": 20021, "car.revisions.1.code": "REV02", "car.revisions.1.changes.0.type": "asthetic", "car.revisions.1.changes.0.desc": "Left tire cap", "car.revisions.1.changes.1.type": "mechanic", "car.revisions.1.changes.1.desc": "Engine pressure regulator", "visits.0.date": "2015-01-01", "visits.0.dealer": "DEAL-001", "visits.1.date": "2015-03-01", "visits.1.dealer": "DEAL-002" };
We are required to write a JavaScript function that takes in one such object and unflattens it into nested objects and arrays.
Therefore, the output for the above array should look like −
const output = { firstName: 'John', lastName: 'Green', car: { make: 'Honda', model: 'Civic', revisions: [ { miles: 10150, code: 'REV01', changes: ''}, { miles: 20021, code: 'REV02', changes: [ { type: 'asthetic', desc: 'Left tire cap' }, { type: 'mechanic', desc: 'Engine pressure regulator' } ] } ] }, visits: [ { date: '2015-01-01', dealer: 'DEAL-001' }, { date: '2015-03-01', dealer: 'DEAL-002' } ] };
Example
const obj = { "firstName": "John", "lastName": "Green", "car.make": "Honda", "car.model": "Civic", "car.revisions.0.miles": 10150, "car.revisions.0.code": "REV01", "car.revisions.0.changes": "", "car.revisions.1.miles": 20021, "car.revisions.1.code": "REV02", "car.revisions.1.changes.0.type": "asthetic", "car.revisions.1.changes.0.desc": "Left tire cap", "car.revisions.1.changes.1.type": "mechanic", "car.revisions.1.changes.1.desc": "Engine pressure regulator", "visits.0.date": "2015-01-01", "visits.0.dealer": "DEAL-001", "visits.1.date": "2015-03-01", "visits.1.dealer": "DEAL-002" }; const unflatten = (obj = {}) => { const result = {}; let temp, substrings, property, i; for (property in obj) { substrings = property.split('.'); temp = result; for (i = 0; i < substrings.length - 1; i++) { if (!(substrings[i] in temp)) { if (isFinite(substrings[i + 1])) { temp[substrings[i]] = []; } else { temp[substrings[i]] = {}; } } temp = temp[substrings[i]]; } temp[substrings[substrings.length - 1]] = obj[property]; } return result; }; console.log(JSON.stringify(unflatten(obj), undefined, 4));
Output
And the output in the console will be −
{ "firstName": "John", "lastName": "Green", "car": { "make": "Honda", "model": "Civic", "revisions": [ { "miles": 10150, "code": "REV01", "changes": "" }, { "miles": 20021, "code": "REV02", "changes": [ { "type": "asthetic", "desc": "Left tire cap" }, { "type": "mechanic", "desc": "Engine pressure regulator" } ] } ] }, "visits": [ { "date": "2015-01-01", "dealer": "DEAL-001" }, { "date": "2015-03-01", "dealer": "DEAL-002" } ] }
- Related Articles
- How do I turn a string in dot notation into a nested object with a value – JavaScript?
- How to import an Object with Sub Objects and Arrays in JavaScript?
- Safely setting object properties with dot notation strings in JavaScript
- How to unflatten an object with the paths for keys in JavaScript?
- How to merge objects into a single object array with JavaScript?
- JavaScript Converting array of objects into object of arrays
- Flat a JavaScript array of objects into an object
- How to convert square bracket object keys into nested object in JavaScript?
- How to Flatten JavaScript objects into a single-depth Object?
- Convert array of objects to an object of arrays in JavaScript
- Converting array of arrays into an object in JavaScript
- Converting two arrays into a JSON object in JavaScript
- Splitting an object into an array of objects in JavaScript
- How to combine 2 arrays into 1 object in JavaScript
- Convert an array of objects into plain object in JavaScript

Advertisements