如何合并两次Spotify API查询的response.JSON数据？

你用Object.assign(data1, data2)合并数据时，之所以只保留第二个请求的内容，是因为Spotify返回的JSON对象里，items是顶层数组属性——Object.assign会直接用data2的items完全替换data1的items，而不是合并两个数组，这才导致你看不到第一个请求的数据。

正确合并并去重的代码实现 #

直接合并两个items数组，同时基于歌曲的唯一ID去重（避免offset重叠导致的重复条目）：

const fetchTopSongs = async (duration) => {
    const response1 = await window.fetch('https://api.spotify.com/v1/me/top/tracks?' +
        querystring.stringify({
            limit: 50,
            offset: 0,
            time_range: duration,
        }), {
            method: 'GET',
            headers: {
                Authorization: 'Bearer ' + accessToken,
            },
        });
    const data1 = await response1.json()
    const response2 = await window.fetch('https://api.spotify.com/v1/me/top/tracks?' +
        querystring.stringify({
            limit: 50,
            offset: 49, 
            time_range: duration,
        }), {
            method: 'GET',
            headers: {
                Authorization: 'Bearer ' + accessToken,
            },
        });
    const data2 = await response2.json()

    // 合并两个请求的items数组
    const combinedItems = [...data1.items, ...data2.items];
    // 用歌曲ID去重，Map的键唯一，重复ID会自动覆盖
    const uniqueItems = Array.from(new Map(combinedItems.map(song => [song.id, song])).values());

    // 提取歌曲名并更新状态
    setTopSongs(uniqueItems.map(song => song.name))
}

代码逻辑说明 #

• 先用扩展运算符[...]把两个items数组合并成一个大数组
• 借助Map去重：把每个歌曲的id作为Map的键，歌曲对象作为值，重复的ID会自动保留最后出现的条目（如果想保留先出现的，把combinedItems换成[...data2.items, ...data1.items]即可）
• 最后把Map中的值转成数组，提取歌曲名传入setTopSongs

你之前的Map写法问题 #

你注释掉的代码里，map1和map2是纯歌曲名字符串数组，但new Map()需要的是键值对数组（比如[[id1, name1], [id2, name2]]），直接传字符串数组会导致逻辑错误。如果只是想合并歌曲名并去重，用Set更简单：

const uniqueSongNames = [...new Set([...data1.items.map(s => s.name), ...data2.items.map(s => s.name)])]

但更推荐用歌曲ID去重，毕竟不同歌曲可能同名，ID是唯一标识。

内容的提问来源于stack exchange，提问作者angela