Async/Await搭配HTTP请求不生效 返回undefined问题排查

await 关键字仅对返回Promise对象的异步操作生效，你写的_json是传统回调风格的方法，本身没有返回Promise，所以await拿到的结果必然是undefined。你在回调函数里写的return JSON.parse(response)，只是把值返回给了XHR的事件回调上下文，根本没法传递到外层的get方法作用域。

把_json改造成返回Promise的实现，不要混用回调和async/await逻辑：

_json: function () {
    return new Promise((resolve, reject) => {
        const xobj = new XMLHttpRequest();
        xobj.overrideMimeType("application/json");
        xobj.open('GET', this.options.url, true);

        xobj.onreadystatechange = function () {
            if (xobj.readyState === 4) {
                if (xobj.status === 200) {
                    // 请求成功，传递解析后的结果
                    resolve(JSON.parse(xobj.responseText));
                } else {
                    // 请求异常抛出错误
                    reject(new Error(`请求失败，状态码：${xobj.status}`));
                }
            }
        };
        xobj.onerror = () => reject(new Error('网络连接异常'));
        xobj.send(null);
    })
},

get: async function () {
    try {
        const resp = await this._json();
        console.log(resp);
    } catch (err) {
        console.error('请求出错：', err);
    }
}

• 移除_json的callback入参，方法直接返回Promise实例
• 请求成功时调用resolve传递解析后的JSON结果，await可以直接接收到这个值
• 补充了非200状态、网络错误的异常捕获逻辑，避免请求失败时无反馈
• get方法中增加try/catch块处理异步异常，符合async/await的标准错误处理写法

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