我有一個這樣的物件陣列：
const arrayOfObjects = [
{ A: 1, B: 2, C: 3 },
{ A: 3, B: 4, C: 1 }
]
還有另一個稱為“標題”的陣列
const headers = [
['A', 'B'],
['C']
]
我必須創建一個與第一個類似的陣列，但是這些物件由headers它的陣列中的內容分割。
這應該是目標：
const result = [
[
{ A: 1, B: 2 },
{ C: 3 }
],
[
{ A: 3, B: 4 },
{ C: 1 }
]
]
我嘗試使用以下方法創建“基本”陣列：
const baseArray = []
headers.forEach((header) => {
const objFromHeader = {};
header.forEach((head) => {
objFromHeader[head] = 0;
});
baseArray.push(objFromHeader);
});
這會給我一個result陣列，但每個鍵都有 0 個值。
然后回圈第一個陣列并將具有正確值的基本陣列放入另一個陣列中。
然后我想根據來自的值填充每個鍵，arrayOfObjects但是在這里我看不到如何回圈該物件陣列并放置正確的值。這種方法的唯一問題是result陣列將有一些來自我正在使用的初始陣列的 0 值，對我來說最好只放置實際具有值而不是 0 的物件（我在想另一個洗掉值 = 0 的鍵的函式...）
我怎樣才能以更好的方式實作它？
小提琴：
https://jsfiddle.net/pmiranda/Lpscz6vt/
uj5u.com熱心網友回復：
迭代物件時，使用findIndexonheaders標識被迭代的屬性應該進入的 headers 陣列中的哪個索引。如果物件尚不存在，則在那里創建一個物件，然后設定屬性。
const arrayOfObjects = [
{ A: 1, B: 2, C:3 },
{ A: 3, B: 4, C:1 }
];
const headers = [
['A', 'B'],
['C']
];
const toResultItem = (object) => {
const resultItem = [];
for (const [key, value] of Object.entries(object)) {
const headersIndex = headers.findIndex(arr => arr.includes(key));
resultItem[headersIndex] ??= {};
resultItem[headersIndex][key] = value;
}
return resultItem;
};
console.log(arrayOfObjects.map(toResultItem));uj5u.com熱心網友回復：
const arrayOfObjects = [
{ A: 1, B: 2, C: 3 },
{ A: 3, B: 4, C: 1 },
];
const headers = [['A', 'B'], ['C', 'D']];
const result = arrayOfObjects.map((obj) =>
headers.map((header) =>
header.reduce((acc, key) => {
acc[key] = obj[key];
return Object.keys(acc).reduce((newAcc, key) => {
if (acc[key]) {
newAcc[key] = acc[key];
}
return newAcc;
}
, {});
}, {})
)
);
console.log(result);uj5u.com熱心網友回復：
Array.forEach執行
邏輯
- 回圈遍歷
arrayOfObjects陣列。 - 在其中，回圈遍歷
headers陣列。 - 在其中，回圈遍歷陣列中的每個
headers陣列。 - 創建一個空物件并使用
headers陣列中物件的值從陣列中的節點分配屬性arrayOfObjects。
const arrayOfObjects = [
{ A: 1, B: 2, C: 3 },
{ A: 3, B: 4, C: 1 }
];
const headers = [
['A', 'B'],
['C']
];
const baseArray = []
arrayOfObjects.forEach((obj) => {
const childNode = [];
headers.forEach((head) => {
const node = {};
head.forEach((key) => node[key] = obj[key]);
childNode.push(node);
});
baseArray.push(childNode);
});
console.log(baseArray)Array.map和Array.reduce實施。
在上述解決方案中使用相同的邏輯實作，我們可以使用Array.map和重寫它，Array.reduce如下所示。
const arrayOfObjects = [
{ A: 1, B: 2, C: 3 },
{ A: 3, B: 4, C: 1 }
];
const headers = [
['A', 'B'],
['C']
];
const output = arrayOfObjects.map((obj) => {
return headers.map((header) => {
return header.reduce((acc, curr) => {
acc[curr] = obj[curr];
return acc;
}, {});
})
})
console.log(output);轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/425413.html
標籤：javascript
下一篇：兩個相同的正則運算式，不同的結果