关于js 中异步调用的猜想

最新推荐文章于 2023-04-02 20:47:37 发布

Hi_JohnsonYu

最新推荐文章于 2023-04-02 20:47:37 发布

阅读量379

点赞数

本文链接：https://blog.youkuaiyun.com/yuqixiansheng/article/details/52169609

版权

js 进行网络异步调用大家都知道,核心是XMLHTTPRequest 对象.通过此对象可以跟服务器交互.但是异步在js 里面是如何实现的呢?

异步调用:当一个异步过程调用发出后，调用者不能立刻得到结果。实际处理这个调用的部件在完成后，通过状态、通知和回调来通知调用者。

同步调用:就是在发出一个功能调用时，在没有得到结果之前，该调用就不返回.

举个栗子:

同步调用:下班回家,要先用钥匙开门,然后才能进入房间;饭做好了,才能吃饭………;
异步调用:按下电饭煲的开始煮饭按钮,然后去看电视,同时等电饭煲哒的一声,就知道饭已经做好了.

默认情况下,js的代码执行都是顺序同步执行的.而且js是单线程的,这意味着你不能通过开一个新的线程来执行一个任务,然后又执行其它的任务.

不过js 可以用线程队列的方式来模拟多线程.比如我要执行一个费时的工作,但这个费时的工作,并不影响我做其它的事情,这个时候完全没有必要一直等它执行完成了,再去
做其它事情.

而是,把这个事情放到线程的队列里面,然后我再接着做别的事情.(注意这两个事情是没有任何关联的)

那么如何把费时的事情放到线程队列中,等待被处理呢?
下面是我个人的猜想:

<!doctype html>

<html>
    <head>
        <title>async</title>

        <style>
            #message{
                color:red;
                width:500px;
                height:200px;
                border:2px green solid;
            }
        </style>
    </head>

    <body>
            <div id = 'message'>init</div>
    </body>

    <script>


        function hardOperate(count,callback){

            setTimeout(function(){

                var i = 0;  

                while(i < count)
                {
                    console.log('do :' + i )
                    i ++;
                }

                callback(i);

            })

            document.getElementById('message').innerText = 'Loading........'

        }


        function finished(value){
            document.getElementById('message').innerText = value+'';
        }


        hardOperate(100000,finished);


    </script>

</html>