如何在JavaScript中過濾和映射陣列

原始陣列中有幾個物件，每個物件都有三個屬性（時間戳、名稱和年齡）。

如果一行中的多個時間戳相隔 15 分鐘，它們將被分組到同一個物件中。之后，將添加一個名為 end 的新屬性，該屬性將是該組最后一個元素的時間戳值加上 15 分鐘。

如果一行中沒有多個元素之間相差 15 分鐘，則結束屬性將使用時間戳加 15 分鐘作為值。

這是我當前的代碼：

const data = [
    {
        timestamp: '2021-11-23T14:15:00 0000',
        name: 'John',
        age: 25,
    },
    {
        timestamp: '2021-11-23T14:30:00 0000',
        name: 'John',
        age: 25,
    },
    {
        timestamp: '2021-11-23T14:45:00 0000',
        name: 'John',
        age: 25,
    },
    {
        timestamp: '2021-11-23T15:45:00 0000',
        name: 'John',
        age: 25,
    },
    {
        timestamp: '2021-11-23T14:15:00 0000',
        name: 'Anne',
        age: 32,
    },
    {
        timestamp: '2021-11-23T14:30:00 0000',
        name: 'Anne',
        age: 32,
    },
    {
        timestamp: '2021-11-23T14:45:00 0000',
        name: 'Anne',
        age: 32,
    },
    {
        timestamp: '2021-11-23T15:45:00 0000',
        name: 'Anne',
        age: 32,
    },
]

const newArray = data.reduce((accumulator, current) => {
    const end = new Date(Date.parse(current.timestamp)   15 * 60 * 1000)
    if (accumulator.length === 0) {
        accumulator.push({
            ...current,
            end,
        })
    } else {
        const last = accumulator[accumulator.length - 1]
        if (last.name === current.name && last.age === current.age) {
            last.end = end
        } else {
            accumulator.push({
                ...current,
                end,
            })
        }
    }
    return accumulator
}, [])

console.log(newArray)

然而，我的代碼的最終結果并不完全是我想要的。我希望我的結果是這樣的：

[
    {
        timestamp: '2021-11-23T14:15:00 0000',
        name: 'John',
        age: 25,
        end: '2021-11-23T15:00:00 0000'
    },
    {
        timestamp: '2021-11-23T15:45:00 0000',
        name: 'John',
        age: 25,
        end: '2021-11-23T16:00:00 0000'
    },
    {
        timestamp: '2021-11-23T14:15:00 0000',
        name: 'Anne',
        age: 32,
        end: '2021-11-23T15:00:00 0000'
    },
    {
        timestamp: '2021-11-23T15:45:00 0000',
        name: 'Anne',
        age: 32,
        end: '2021-11-23T16:00:00 0000'
    }
]

uj5u.com熱心網友回復：

您可以搜索最后一個間隔并end在找到時更新。否則添加一個新物件。

const data = [{ timestamp: '2021-11-23T14:15:00 0000', name: 'John', age: 25 }, { timestamp: '2021-11-23T14:30:00 0000', name: 'John', age: 25 }, { timestamp: '2021-11-23T14:45:00 0000', name: 'John', age: 25 }, { timestamp: '2021-11-23T15:45:00 0000', name: 'John', age: 25 }, { timestamp: '2021-11-23T14:15:00 0000', name: 'Anne', age: 32 }, { timestamp: '2021-11-23T14:30:00 0000', name: 'Anne', age: 32 }, { timestamp: '2021-11-23T14:45:00 0000', name: 'Anne', age: 32 }, { timestamp: '2021-11-23T15:45:00 0000', name: 'Anne', age: 32 }]

const newArray = data.reduce((accumulator, current) => {
    const
        end = new Date(Date.parse(current.timestamp)   15 * 60 * 1000).toISOString(),
        item = accumulator.find(o =>
            o.name === current.name &&
            o.end === new Date(current.timestamp).toISOString()
        );
    
    if (item) item.end = end;
    else accumulator.push({ ...current, end });

    return accumulator;
}, [])

console.log(newArray);

.as-console-wrapper { max-height: 100% !important; top: 0; }

uj5u.com熱心網友回復：

您可以使用Array.reduce()自己的代碼來獲取所需的結果，但我們可以稍作更改以更新累加器陣列中的最后一項，如果

• 名稱相同（lastItem.name === name）
• 日期在 15 分鐘內

如果不滿足此條件，我們只需將其添加到累加器陣列中。

const data = [ { timestamp: '2021-11-23T14:15:00 0000', name: 'John', age: 25, }, { timestamp: '2021-11-23T14:30:00 0000', name: 'John', age: 25, }, { timestamp: '2021-11-23T14:45:00 0000', name: 'John', age: 25, }, { timestamp: '2021-11-23T15:45:00 0000', name: 'John', age: 25, }, { timestamp: '2021-11-23T14:15:00 0000', name: 'Anne', age: 32, }, { timestamp: '2021-11-23T14:30:00 0000', name: 'Anne', age: 32, }, { timestamp: '2021-11-23T14:45:00 0000', name: 'Anne', age: 32, }, { timestamp: '2021-11-23T15:45:00 0000', name: 'Anne', age: 32, }, ] 
    
const result = data.reduce((acc, { timestamp, name, age }) => { 
    let lastItem = acc[acc.length - 1];
    let end = new Date(Date.parse(timestamp)   15*60*1000);
    
    // If the current row matches just update the end time
    if (lastItem && lastItem.name === name && (Date.parse(lastItem.end) - Date.parse(timestamp) >= 0)) { 
        lastItem.end = end;
    } else {
        acc.push({ timestamp, name, age, end });
    } 
    return acc;
}, [])

console.log(result)

.as-console-wrapper { max-height: 100% !important; top: 0; }

標籤：javascript 数组 javascript对象

上一篇：在React中反向填充陣列

下一篇：陣列JavaScript問題。第一個元素轉到最后一個位置