JavaScript异步控制

问题：实现Sleep效果

要求实现一个sleep函数，传递一个时间参数，再执行函数后睡眠传递的参数后，在执行后面的代码。

function sleep(time) {
    return new Promise((resolve, reject) => {
        setTimeout(function() {
            resolve();
        }, time);
    });
}

(async function test() {
    await sleep(5000);
    console.log("wupq~");
})();

问题：person('xiaoming').eat(2000).sleep(1000).run(1500).sleep(500)

要求运行结果是，先打印xiaoming，过两秒打印eat，再过1秒打印sleep，再过1.5秒打印run，再过0.5s打印sleep

class Person {
    constructor(name) {
        this.name = name;
        this.promiseChain = Promise.resolve();
        console.log(name);
    }

    eat(delay) {
        this.promiseChain = this.promiseChain.then(() => {
            return new Promise((resolve) => {
                setTimeout(() => {
                    console.log("eat");
                    resolve();
                }, delay);
            });
        });
        return this;
    }

    sleep(delay) {
        this.promiseChain = this.promiseChain.then(() => {
            return new Promise((resolve) => {
                setTimeout(() => {
                    console.log("sleep");
                    resolve();
                }, delay);
            });
        });
        return this;
    }

    run(delay) {
        this.promiseChain = this.promiseChain.then(() => {
            return new Promise((resolve) => {
                setTimeout(() => {
                    console.log("run");
                    resolve();
                }, delay);
            });
        });
        return this;
    }
}

const person = (name) => {
    return new Person(name);
};

person("wupq~").eat(2000).sleep(1000).run(1500).sleep(500);

总结

该类题的主要难点在于如何控制异步函数执行的顺序，我们毋庸置疑可以通过setTimeout在指定的延迟后执行打印操作，并在操作完成后调用resolve来通知 Promise 已完成。因为我们每次都会更新promiseChain（promiseA+规范规定then方法返回值必须是一个promise对象）这样通过定时器延时来达到睡眠的效果；每个方法在完成自己的操作后都返回this，使得可以连续调用多个方法，形成方法链式调用的风格。