如何將鏈式/點符號表示形式中的 JavaScript 物件扁平化為包含巢狀物件和陣列的物件?
假設我們有一個這樣的物件 −
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"
}
]
}
廣告
資料結構
網路
關係資料庫管理系統
作業系統
Java
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
JavaScript
PHP