同步请求与异步请求

同步：

优点：简单直观，代码从上往下执行，因为代码从上到下执行，因此不会涉及回调函数等异步操作

缺点：

1.同步请求会阻塞整个程序或页面，使得用户界面在请求完成前处于不响应状态。这可能导致页面卡顿、用户体验差，特别是在大量同步请求的情况下。

2.步请求可能对应用的性能产生负面影响，因为它们会占用执行线程并阻塞其他任务。

3.在大规模并发请求的情况下，同步请求可能导致服务器资源瓶颈，并影响整体性能。

异步：

优点：

提高性能： 异步请求允许在等待服务器响应的同时执行其他任务，不会阻塞程序的执行。这有助于提高应用的响应速度和性能。

提高用户体验： 异步请求使得页面在数据加载的同时可以保持响应性，提高用户体验。用户不必等待整个页面刷新，而是只更新部分内容。

并发处理： 异步请求支持并发处理多个请求，可以同时向多个资源请求数据，而不需要等待一个请求完成后再发送下一个请求。

实时更新： 异步请求适用于实时更新的场景，例如聊天应用或实时通知系统，用户可以接收到新数据而无需手动刷新页面。

缺点： 

复杂性： 异步编程可能会引入复杂性，特别是在处理回调函数、Promise链或async/await时。这可能使得代码难以理解和维护。

错误处理： 错误处理可能变得复杂，因为异步操作可能在不同的时间点返回结果。错误处理需要特别注意，以确保错误能够被捕获和适当处理。

SEO 难度： 搜索引擎优化 (SEO) 对于异步加载的内容的索引可能存在一些挑战。搜索引擎通常更喜欢直接从HTML中获取内容。

场景：一进页面调用接口判断用户是否还有抽奖次数

getLunturnableNums(){
$.ajax({
            url: base.xxx + "xxx",
            data: {
                
            },
            type: 'POST',
            success: function (res) {
                if (res.code === 200) {
                    result = true
                } else {
                    result = false
                }
            },
            error: function (err) {
                reject(err);
            }
        })
}
let is_getLunturnableNums = getLunturnableNums()

这里获取到的 is_getLunturnableNums为undefined，因为getLunturnableNums 函数本身并不会等待请求完成，而是立即返回一个 undefined 值。

解决方案：

1.同步请求：

getLunturnableNums(){
$.ajax({
            url: base.xxx + "xxx",
            data: {
                
            },
            type: 'POST',
            async: false,  // 同步请求
            success: function (res) {
                if (res.code === 200) {
                    result = true
                } else {
                    result = false
                }
            },
            error: function (err) {
                reject(err);
            }
        })
}
let is_getLunturnableNums = getLunturnableNums()

 优化方案：异步请求

 getLunturnableNums() {
    return new Promise((resolve, reject) => {
        var mis = mise();
        $.ajax({
            url: base.xxxi + "xxx",
            data: {
            },
            type: 'POST',
            success: function (res) {
                if (res.code === 200) {
                    resolve(true);
                } else {
                    resolve(false);
                }
            },
            error: function (err) {
                reject(err);
            }
        });
    });
}

// 修改为直接返回异步操作结果
async function getLunturnableNumsResult() {
    try {
        let is_getLunturnableNums = await getLunturnableNums();
        return is_getLunturnableNums;
    } catch (error) {
        throw error;
    }
}

// 直接调用获取结果
let is_getLunturnableNums = getLunturnableNumsResult();
console.log(is_getLunturnableNums);