您好,欢迎来到易妖游戏网。
搜索
您的当前位置:首页lazyMan:事件队列结合链式调用

lazyMan:事件队列结合链式调用

来源:易妖游戏网

参考资料:
非常有意思的一道链式调用。参考资料中使用async和await语法糖完成,更加简介。
此处笔者使用promise的写法。

修改:此处代码有一个错误,当上下两行同步调用时会将任务一起塞进任务队列中
暂时没想到解法。如果有好的解法欢迎留评论告诉我
举个例子

        let obj = _Lazyman('Hank');
        obj.eat('dinner').sleepFirst(5);
        obj.eat('food').sleepFirst(2);
        // 这导致sleepFirst(2)先行。
        // 事实上就是先将上下两行加入了任务队列
        // 因为是通过任务队列去储存,通过宏任务去实现,这个问题一直会存在

以下是原先代码块

class _Lazyman {
            constructor(name) {
                this.taskQue = []; // 储存任务队列
                this.timer = null;
            }

            run() {
            // 进入run中会进行timer的重置。
            // 当有新任务入队,清空设定的宏任务,再一次执行任务队列
                if (this.timer) clearTimeout(this.timer);
                this.timer = setTimeout(() => {
                	// 异步任务顺序执行
                    let promise = Promise.resolve();
                    this.taskQue.forEach(fn => {
                        promise = promise.then(v => {
                            return fn();
                        })
                    });
                    this.taskQue = [];
                    this.timer = null;
                }, 0);

                return this;
            }

            sayHi(name) {
                this.taskQue.push(() => {
                    return new Promise(resolve => {
                        console.log(`Hello,${name}.`);
                        resolve();
                    })
                });

                this.run(); // 尝试执行
                return this;
            }

            eat(food) {
                this.taskQue.push(() => {
                    return new Promise(resolve => {
                        console.log(`eat ${food}.`);
                        resolve();
                    })
                });

                this.run();
                return this;
            }

            sleep(second) {
                this.taskQue.push(() => {
                    return new Promise(resolve => {
                        console.log(`sleep ${second}s.`);
                        setTimeout(() => {
                            resolve();
                        }, second * 1000);
                    })
                });

                this.run();
                return this;
            }

            sleepFirst(second) {
                this.taskQue.unshift(() => {
                    return new Promise(resolve => {
                        console.log(`sleep ${second}s first.`);
                        setTimeout(() => {
                            resolve();
                        }, second * 1000);
                    })
                });

                this.run();
                return this;
            }
        }

        let lazyman = name => new _Lazyman(name);
        lazyman('Jack').eat('fish').sleepFirst(5).sleep(1).eat('vegetable');

因篇幅问题不能全部显示,请点此查看更多更全内容

Copyright © 2019- vipyiyao.com 版权所有 湘ICP备2023022495号-8

违法及侵权请联系:TEL:199 18 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务