js 同步异步执行顺序

最新推荐文章于 2025-01-23 17:04:16 发布

原创最新推荐文章于 2025-01-23 17:04:16 发布 · 185 阅读

CC 4.0 BY-SA版权

本文介绍了一个使用JavaScript实现的懒加载函数，通过异步调用和定时器实现了任务的延迟执行，包括延迟问候、睡眠和吃饭等功能。展示了如何利用原型链进行方法的扩展，并通过实例演示了函数的使用。

function lazyMan(name) {

            function Man() {
                setTimeout(function () {
                    console.log(`Hi! This is ${name}!`);
                },0)
            }

            Man.prototype.sleep = function (time) {

                setTimeout(function () {
                    console.log(`Wake up after ${time}!`);
                },time*1000)

                // 把异步的转成同步的等待10秒；
                setTimeout(function () {
                    // 加定时器，为了让此处整体变成异步；
                    let duration = time *1000;// 10秒的毫秒差；
                    let curTime= Date.now();
                    //当过了10秒之后，继续执行下面的代码;while 循环是用来阻塞当前主线程；因为while循环是同步的；当while不结束；那么代码不能向下运行；
                    while(Date.now()-curTime<=duration){};
                    console.log(`Wake up after ${time}!`);
                },0);

                return this;
            }

            Man.prototype.eat = function (food) {

                setTimeout(function () {
                    console.log(`Eat  ${food}~`);
                },0)

            return this;// 实例
        };

        Man.prototype.sleepFirst = function (time) {

            let duration = time*1000;
            let curTime =Date.now();

            // while ： 用来阻塞线程；不是只有定时器可以解决时间问题；

            while(Date.now()-curTime<=duration){};

            console.log(`Wake up after ${time}`);

            return this;
        }
        
        return new Man()
    }
    lazyMan("Hank").sleepFirst(5).eat("supper")