JavaScript中等待两个ajax异步请求完成解决方式记录

在JavaScript中等待两个Ajax异步请求完成的一种常见方法是使用Promise.all()方法。你可以将两个Ajax异步请求封装成 Promise对象，并将它们放入一个数组中，然后使用Promise.all()来等待它们都完成。

    function request(url) {
        return new Promise((resolve, reject) => {
            $.ajax({
                type: 'GET',
                url: url,
                dataType: "json",
                data: data,
                success: function (res) {
                    if (res.status === 200) {
                        resolve(xhr.response);
                    } else {
                        reject(new Error(xhr.statusText));
                    }
                },
                error: function (res) {
                    reject(new Error(res));
                }
            });
        });
    }

     // 第一个异步请求
    const request1 = request('url1');

     // 第二个异步请求
    const request2 = request('url2');

    // 使用Promise.all()等待两个异步请求完成
    Promise.all([request1, request2])
        .then(results => {
            // 两个异步请求都完成了
            const result1 = results[0]; // 第一个请求的结果
            const result2 = results[1]; // 第二个请求的结果
            // 处理结果
            console.log(result1, result2);
        })
        .catch(error => {
            // 处理错误
            console.error(error);
        });

在这个示例中，我们创建了request()函数，用来发送Ajax异步请求并返回一个Promise对象。然后，我们创建了两个Promise对象 request1 和 request2，每个对象代表一个Ajax异步请求。接下来，我们使用Promise.all()来等待这两个请求都完成。当两个请求都成功完成时，将返回一个包含两个请求结果的数组 results。你可以在.then()中处理这两个结果。如果任何一个请求失败，将进入.catch()块来处理错误。

Promise.all()方法的兼容性如下：

• 支持所有现代浏览器，包括Chrome、Firefox、Safari和Edge等最新版本。
• 不支持Internet Explorer，因为Promise和Promise.all()方法在IE中不被原生支持。