Javascript 把 setTimeout 改成 delay，延时执行+链式调用

背景

用 setTimeout 多了，总是觉得这函数就差那么一点点，不是很顺手，就萌生了要改造一下此函数的念头；改成可以链式编程的，名字也更加接地气点的，就叫 delay 吧。

直接挂原型链代码如下：

/**
 * 让目标(Object)延时执行，可以链式使用
 * 
 * @param {Number} time
 * @param {Function} doSomething - 
 *                               - @param {Object} self -- 作为参数回调使用
 *                               - @param {Number} startTime -- 作为参数回调使用
 * @return {Object} 
 */
Object.prototype.delay = function (time, doSomething) {
    var self = this,
        startTime = time;
    if (self) {
        setTimeout(function () {
            doSomething(self, startTime);
        }, time);
    }
    return this;
}

链式使用例子代码如下：

document.querySelector('#retarder')
    .delay(1000, function (self) {
        self.innerHTML = 'Hello';
    })
    .delay(1500, function (self) {
        self.innerHTML = 'World';
    });

非链式使用，由 10 到 0 倒计时例子代码如下：

var el = document.querySelector('#retarder');
for (var i = 0; i <= 10; i++) {
    el.delay(i * 1000, function (self, startTime) {
        self.innerHTML = 10 - startTime / 1000;
    })
}

作者： 博主

Talk is cheap, show me the code! 查看博主的所有文章