我有這樣的嵌套物件陣列：
[
{
tasks: [
{
requestTaskId: 'be6ee458-8ef0-11ec-912a-3d12c29b6342',
price: 5,
},
{
requestTaskId: 'be6ee502-8ef0-11ec-b81a-3d12c29b6342',
price: 5,
},
],
request: {
tasks: [
{
id: 'be6ee458-8ef0-11ec-912a-3d12c29b6342',
quantity: 10,
},
{
id: 'be6ee502-8ef0-11ec-b81a-3d12c29b6342',
quantity: 10,
},
],
},
},
];
我需要總結任務的所有價格和數量，還要按 tasks.requestTaskId === request.tasks.id條件檢查/匹配。
結果應該是 (10 * 5) (10 * 5) = 100。
如何使用map//得到這個find？reduce想不出更好的幫手來實作這一點，只是不知道如何結合一切。
這是我嘗試過的：
array.map((item) => ({
...item,
...item.request.tasks.find((requestTask) => ({
...requestTask,
...item.tasks.find(({ requestTaskId }) => requestTaskId === requestTask.id),
})),
}))
.map(({ amount, quantity})) => ({
total: amount * quantity,
});
uj5u.com熱心網友回復：
您可以使用Array.reduce()對所有任務的總價格求和，首先呼叫輸入陣列，然后呼叫任務。
如果沒有requestTask找到任務，我們將簡單地將總數保持不變。如果您覺得這更好地反映了您的用例，您可以更改此行為以引發錯誤。
我們將其包裝在一個getTotalSum()函式中。
let input1 = [ { tasks: [ { requestTaskId: 'be6ee458-8ef0-11ec-912a-3d12c29b6342', price: 5, }, { requestTaskId: 'be6ee502-8ef0-11ec-b81a-3d12c29b6342', price: 5, }, ], request: { tasks: [ { id: 'be6ee458-8ef0-11ec-912a-3d12c29b6342', quantity: 10, }, { id: 'be6ee502-8ef0-11ec-b81a-3d12c29b6342', quantity: 10, }, ], }, }, ];
let input2 = [ { tasks: [ { requestTaskId: '4a0cc1d8-9720-48c4-9678-3372c20ff7c3', price: 10, }, { requestTaskId: '6c178a61-e9aa-45bf-bcde-1a52bcd29205', price: 1, }, ], request: { tasks: [ { id: '4a0cc1d8-9720-48c4-9678-3372c20ff7c3', quantity: 2, }, { id: '6c178a61-e9aa-45bf-bcde-1a52bcd29205', quantity: 3, }, ], }, }, ];
function getTotalSum(input) {
return input.reduce((total, { tasks, request }) => {
return tasks.reduce((total, task) => {
const requestTask = request.tasks.find(({ id }) => id === task.requestTaskId);
total = requestTask ? task.price * requestTask.quantity: 0;
return total;
}, total)
}, 0)
}
console.log('Sum1:', getTotalSum(input1))
console.log('Sum2:', getTotalSum(input2))uj5u.com熱心網友回復：
這是一個假設您在頂級物件中出現多個物件的給定資料的示例：
const data = [{
tasks: [{
requestTaskId: 'be6ee458-8ef0-11ec-912a-3d12c29b6342',
price: 5,
},
{
requestTaskId: 'be6ee502-8ef0-11ec-b81a-3d12c29b6342',
price: 5,
},
],
request: {
tasks: [{
id: 'be6ee458-8ef0-11ec-912a-3d12c29b6342',
quantity: 10,
},
{
id: 'be6ee502-8ef0-11ec-b81a-3d12c29b6342',
quantity: 10,
},
],
},
},];
// function for calculating the total of one object holding tasks and request props.
function calculateTotalPrice(entity) {
// iterate through all tasks and "reduce" them to one number :)
return entity.tasks.reduce((total, task) => {
// Search for a request with the same id!.
const request = entity.request.tasks.find(request => request.id === task.requestTaskId)
if (request) {
return total (request.quantity * task.price)
}
// If no price is found, return current total and log something!.
console.log('No price found for task:', task)
return total
}, 0)
}
// With your object you can now reduce this aswell for getting the grand
// total over all objects..
const totalPrice = data.reduce((grandTotal, entity) => {
return grandTotal calculateTotalPrice(entity)
}, 0)
console.log('totalPrice:', totalPrice)
uj5u.com熱心網友回復：
如果您的物件的順序如圖所示，每個任務按索引進行相應的請求，那么使用.map()and.reduce()方法將實作您的目標：
const total = orders.map(order => order.tasks.reduce(
(tot, prod, index) => tot prod.price * order.request.tasks[index].quantity, 0
));
console.log( total );
演示
顯示代碼片段
const orders = [{
tasks: [{
requestTaskId: 'be6ee458-8ef0-11ec-912a-3d12c29b6342',
price: 5,
},
{
requestTaskId: 'be6ee502-8ef0-11ec-b81a-3d12c29b6342',
price: 5,
},
],
request: {
tasks: [{
id: 'be6ee458-8ef0-11ec-912a-3d12c29b6342',
quantity: 10,
},
{
id: 'be6ee502-8ef0-11ec-b81a-3d12c29b6342',
quantity: 10,
},
],
},
},{
tasks: [{
requestTaskId: 'dabee458-8ef0-11ec-912a-3d12c29b6342',
price: 15,
},
{
requestTaskId: 'dabee502-8ef0-11ec-b81a-3d12c29b6342',
price: 15,
},
],
request: {
tasks: [{
id: 'dabee458-8ef0-11ec-912a-3d12c29b6342',
quantity: 15,
},
{
id: 'dabee502-8ef0-11ec-b81a-3d12c29b6342',
quantity: 50,
},
],
},
}];
const total = orders.map(order => order.tasks.reduce(
(tot, prod, index) => tot prod.price * order.request.tasks[index].quantity, 0
));
console.log( total );轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/425125.html
標籤：javascript 数组 和 映射