我有一個這樣的物件：
const objBefore:
{
"id": "3pa99f64-5717-4562-b3fc-2c963f66afa1",
"number": "5000",
"enabled": true,
"classes": [
{
"id": "2fc87f64-5417-4562-b3fc-2c963f66afa4",
"name": "General"
},
{
"id": "7ffcada8-0215-4fb0-bea9-2266836d3b18",
"name": "Special"
},
{
"id": "6ee973f7-c77b-4738-b275-9a7299b9b82b",
"name": "Limited"
}
]
}
使用 es6，我想獲取物件中除了內部類陣列的名稱鍵之外的所有內容，以將其傳遞給 api。
所以：
{
"id": "3pa99f64-5717-4562-b3fc-2c963f66afa1",
"number": "5000",
"enabled": true,
"classes": [
{"id": "2fc87f64-5417-4562-b3fc-2c963f66afa4"},
{"id": "7ffcada8-0215-4fb0-bea9-2266836d3b18"},
{"id": "6ee973f7-c77b-4738-b275-9a7299b9b82b"}
]
}
我得到的最接近的是：let {id, number, enabled, classes: [{id}]} = objBefore;
但它只會讓我在課堂上獲得一個 id。我嘗試使用[...{id}]or進行上述傳播[{...id}]。一樣。
我發現在多個層面上獲得正確的思維模型來思考這個問題是很有挑戰性的。在我看來，當我說[...{id}] 我在想，“我希望 id 屬性作為外部類陣列中的一個物件，但給我陣列中的每個 id！”
顯然，我沒有正確考慮這一點。
我已經嘗試使用 map 來獲取該部分，但我仍然無法將其組合回原件以產生所需的結果。例如：
let classIds = objBefore.classes.map(({id}) => {
return {
id
}
})
（使用 map 語法，我如何在函式中解構更高一級的其他鍵？）
為了將它們結合起來，我開始嘗試任何東西，：
let {id, number, enabled, classIds} = {objBefore, [...classIds]} // returns undefined for all
我寧愿在一個宣告中做到這一點。但是，如果這不可能，那么使用地圖的干凈方法是什么？
uj5u.com熱心網友回復：
您不能以您希望的方式同時進行解構和映射。解構賦值的主要目的是從陣列/物件中提取資料，而不是用于操作資料。在您的情況下，由于您要使用與原始物件具有相同鍵/值的物件，只是使用不同的 classes陣列，因此我建議創建一個新物件并將原始物件傳播到該物件中。...然后，您可以使用該陣列的映射版本覆寫該classes陣列：
const objBefore = { "id": "3pa99f64-5717-4562-b3fc-2c963f66afa1", "number": "5000", "enabled": true, "classes": [ { "id": "2fc87f64-5417-4562-b3fc-2c963f66afa4", "name": "General" }, { "id": "7ffcada8-0215-4fb0-bea9-2266836d3b18", "name": "Special" }, { "id": "6ee973f7-c77b-4738-b275-9a7299b9b82b", "name": "Limited" } ] };
const newObj = {
...objBefore,
classes: objBefore.classes.map(({id}) => ({id}))
};
console.log(newObj);uj5u.com熱心網友回復：
如何使用簡單的 util 方法和物件解構、擴展運算子和map
const objBefore = {
id: "3pa99f64-5717-4562-b3fc-2c963f66afa1",
number: "5000",
enabled: true,
classes: [
{
id: "2fc87f64-5417-4562-b3fc-2c963f66afa4",
name: "General",
},
{
id: "7ffcada8-0215-4fb0-bea9-2266836d3b18",
name: "Special",
},
{
id: "6ee973f7-c77b-4738-b275-9a7299b9b82b",
name: "Limited",
},
],
};
const process = ({ classes, ...rest }) => ({
...rest,
classes: classes.map(({ id }) => ({ id })),
});
console.log(process(objBefore))uj5u.com熱心網友回復：
在一行中，您可以這樣做：
const objAfter = { ...objBefore, classes: objBefore.classes.map(item => ({ id: item.id })) };
或者，如果您愿意：
const objAfter = {...objBefore, classes: objBefore.classes.map(({id}) => ({id}))};
在物件破壞中沒有任何方法可以通過洗掉屬性將整個物件陣列復制到不同的物件陣列中，因此您可以使用.map()它。
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/438169.html
標籤：javascript 数组 反应 json ecmascript-6
下一篇：郵遞員不儲值