全局数组playerlist执行push操作后读取元素为undefined问题求助

问题本质是AJAX异步执行特性导致的，和Node后端逻辑无关。

• $.ajax是异步网络请求，JS执行到该语句时只会提交请求，不会等待请求返回结果，会立刻执行后续的console.log(playerlist[0])代码
• 你向playerlist数组插入数据的逻辑写在$.ajax的success回调里，只有网络请求成功返回后才会触发该回调，这个执行时机明显晚于后面的console.log执行时机，所以此时数组还是空的，自然输出undefined

方案1：将后续操作移入异步回调内部 #

把所有需要用到请求返回结果、或者依赖playerlist更新的逻辑，都放到success回调或者displayData函数内部执行：

function addplayer() {
    var epicName = $('#epic');
    var uri = 'https://fortnitetracker.com/api/v0/profiles/find?platformUserHandle='
    var data = {};
    data.uri = uri + epicName.val().replace(' ', '+');
    $.ajax({
        type: "POST",
        url: '/',
        dataType: 'json',
        data : data,
        success: function(data){
            data = JSON.parse(data);
            displayData(data);
            // 数组已经完成插入，此处打印可以拿到有效值
            console.log(playerlist[0]);
        }
    });
    function displayData(data){
        var epicUserId = data.platformUserId;
        var epicUserName = data.platformUserHandle;
        playerlist.push(epicUserName);
        playerdict[epicUserName] = epicUserId;
    }
}

方案2：用Promise+async/await改写，实现同步写法 #

如果后续逻辑比较复杂，嵌套回调容易混乱，可以用Promise封装异步请求，搭配async/await让异步逻辑按同步顺序执行：

// 封装异步请求为Promise
function fetchPlayerInfo(epicName) {
    const requestUri = 'https://fortnitetracker.com/api/v0/profiles/find?platformUserHandle=' + epicName.val().replace(' ', '+');
    return new Promise((resolve, reject) => {
        $.ajax({
            type: "POST",
            url: '/',
            dataType: 'json',
            data: { uri: requestUri },
            success: (res) => resolve(JSON.parse(res)),
            error: (err) => reject(err)
        })
    })
}

// addplayer改为async异步函数
async function addplayer() {
    const epicName = $('#epic');
    try {
        // 等待请求返回结果后再执行后续代码
        const playerInfo = await fetchPlayerInfo(epicName);
        const epicUserId = playerInfo.platformUserId;
        const epicUserName = playerInfo.platformUserHandle;
        playerlist.push(epicUserName);
        playerdict[epicUserName] = epicUserId;
        // 此时数组已经完成更新，可以正常打印
        console.log(playerlist[0]);
    } catch (e) {
        console.error('请求玩家信息失败：', e);
    }
}

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