深刻理解ajax中同步和异步的区别和使用场景

最新推荐文章于 2024-08-14 17:39:39 发布

码农大叔的博客

最新推荐文章于 2024-08-14 17:39:39 发布

阅读量7.2k

点赞数

分类专栏： Ajax javascript 文章标签： ajax 异步同步

本文链接：https://blog.csdn.net/ligaofeng/article/details/78759005

版权

Ajax 同时被 2 个专栏收录

7 篇文章 0 订阅

订阅专栏

javascript

7 篇文章 0 订阅

订阅专栏

先上两段代码，猜下这两段代码的console.log的执行顺序和结果：

代码一：

                    $.ajax({
                        type: "post",
                        async:true, //不设置此参数的话默认为true
                        url: "/teacher/ajaxtimeline",
                        data: {"month": month, "uid":<?php echo intval($teacher->uid);?>},
                        dataType: "json",
                        success: function(data) {
                            //假设data.canNotSetDays服务端返回的是[9,10,11]
                            $.each(data.canNotSetDays, function(i, item) {
                                canNotSetDays.push(item);
                            });

                            console.log('**********ajax result ************');
                            //此处是可以获取canNotSetDays的值的，并能查找到其中的元素数字9
                            console.log(canNotSetDays);
                            console.log(canNotSetDays.length);
                            console.log(canNotSetDays.indexOf(9));

                        }
                    });

                    console.log('***********after ajax ***********');

                    //此处是获取不到canNotSetDays的值的，长度为0，无法查找到其中的元素数字9
                    console.log(canNotSetDays);
                    console.log(canNotSetDays.length);
                    console.log(canNotSetDays.indexOf(9));

                    console.log('**********delay two seconds************');

                    setTimeout(function(){
                        //延迟2秒后也是可以获取canNotSetDays的值的，并能查找到其中的元素数字9
                        console.log(canNotSetDays);
                        console.log(canNotSetDays.length);
                        console.log(canNotSetDays.indexOf(9));
                    }, 2000);

代码二：

                     $.ajax({
                        type: "post",
                        async:false, //不设置此参数的话默认为true
                        url: "/teacher/ajaxtimeline",
                        data: {"month": month, "uid":<?php echo intval($teacher->uid);?>},
                        dataType: "json",
                        success: function(data) {
                            //假设data.canNotSetDays服务端返回的是[9,10,11]
                            $.each(data.canNotSetDays, function(i, item) {
                                canNotSetDays.push(item);
                            });

                            console.log('**********ajax result ************');
                            //此处是可以获取canNotSetDays的值的，并能查找到其中的元素数字9
                            console.log(canNotSetDays);
                            console.log(canNotSetDays.length);
                            console.log(canNotSetDays.indexOf(9));

                        }
                    });

                    console.log('***********after ajax ***********');

                    //此处是可以获取canNotSetDays的值的，并能查找到其中的元素数字9
                    console.log(canNotSetDays);
                    console.log(canNotSetDays.length);
                    console.log(canNotSetDays.indexOf(9));

                    console.log('**********delay two seconds************');

                    setTimeout(function(){
                        //延迟2秒后肯定也是可以获取canNotSetDays的值的，并能查找到其中的元素数字9
                        console.log(canNotSetDays);
                        console.log(canNotSetDays.length);
                        console.log(canNotSetDays.indexOf(9));
                    }, 2000);