如何將具有名稱和值的物件轉換為物件陣列,就像下面的格式一樣。
'result' : { "name1" : "Angle", "name2" : "Demon", "name3" : "Hunter"}
期望的輸出:
"result" : [
{'name1' : 'Angle'},
{'name2' : 'Demon'},
{'name3' : 'Hunter'}
]
uj5u.com熱心網友回復:
您可以使用Object.entries和Array#map方法如下:
const input = {'result' : { "name1" : "Angle", "name2" : "Demon", "name3" : "Hunter"}}
const output = [input].map(
({result}) =>
({result: Object.entries(result).map(([k,v]) => ({[k]:v}))})
)[0];
console.log( output );
uj5u.com熱心網友回復:
const result = { "name1" : "Angle", "name2" : "Demon", "name3" : "Hunter"};
const res = Object.keys(result).map(item => {
const obj = {};
obj[item] = result[item]
return obj;
});
console.log(res);
uj5u.com熱心網友回復:
使用Object.entries:
const input = { "name1": "Angle", "name2": "Demon", "name3": "Hunter" };
const result = Object.entries(input).map(([k, v]) => ({ [k]: v }));
console.log(result);
使用Object.keys:
const input = { "name1": "Angle", "name2": "Demon", "name3": "Hunter" };
const result = Object.keys(input).map(k => ({ [k]: input[k] }));
console.log(result);
給出的箭頭函式的句法體操分解map。
注意我們在哪里:
.map(([k, v]) => ({ [k]: v })
基本上,回傳的陣列的每個元素Object.entries本身就是一個有兩個值的陣列,第一個是屬性名(key),第二個是屬性值。對于此示例,Object.entries(input)回傳:
[
[ "name1", "Angle" ],
[ "name2", "Demon" ],
[ "name3", "Hunter" ]
]
但是我們想["name1", "Angle"]變成一個像{ name1: "Angle" }.
最直接的表達方式是:
Object.entries(input).map(entry => {
return { [entry[0]]: entry[1] };
}
上面語法中唯一棘手的部分是基于具有語法的變數創建動態屬性名稱{ [key]: value }。我們想要一個以entry[0]in 值命名的屬性,entry[1]并且{ [entry[0]]: entry[1] }會這樣做。
但是我們可以利用一些解構并直接從箭頭函式回傳物件。
解構。entry我們可以立即將這個短的 2 元素陣列解構為鍵和值,而不是用作引數。盡管寫起來很誘人,但[k, v] => 您必須將其括在括號中,例如([k, v]) => .
returning an object from an arrow function. It's also tempting to return an object literal like => { name1: "Angle" } but again, that's ambiguous (looks like a code block) so we have to enclose the object literal with parentheses: => ({ name1: "Angle" })
All those extra parentheses are unfortunately necessary. The whole thing looks like:
Object.Entries(input).map(([k, v]) => ({ [k]: v }));
So perhaps you may find the destructuring syntax is clunky because of the parentheses. Instead you can use Object.keys. Object.keys(input) returns:
[
"name1",
"name2",
"name3"
]
We can map each property name to the desired object like this .map(k => ({ [k]: input[k] })) Which saves us a little bit of destructuring syntax awkwardness at the cost of having to specify the array by its name again.
This is likely the fastest way, if the number of properties is large, because it should use fewer allocations and intermediate objects.
使用回圈的替代方法
還有另一種方法,使用回圈,如果屬性數量非常少,它比上述兩種方法都快。
const input = { "name1": "Angle", "name2": "Demon", "name3": "Hunter" };
const result = [];
for (let key in input) result.push({ [key]: input[key] });
console.log(result);
(我發現這實際上在您的微小測驗資料上表現最好。)
但我個人更喜歡函式式構造而不是命令式構造,因為它讓編譯器有機會做一些比回圈更有效的事情。我相信我們應該教下一代程式員接受描述程式的現代方式,而回圈在這方面已經過時了。
uj5u.com熱心網友回復:
使用Object.fromEntries和Object.entries
const input = { "name1": "Angle", "name2": "Demon", "name3": "Hunter" };
const result = Object.entries(input).map((ent) => Object.fromEntries([ent]));
console.log(result);
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/455823.html
