如何将菊花链/点符号中的 JavaScript 对象展开为具有嵌套对象和数组的对象?
javascriptweb developmentfront end technologyobject oriented programming
假设我们有一个这样的对象 −
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" };
我们需要编写一个 JavaScript 函数,该函数接受一个这样的对象并将其展开为嵌套对象和数组。
因此,上述数组的输出应如下所示 −
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' } ] };
示例
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));
输出
控制台中的输出将是 −
{ "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" } ] }