jq: callbacks/deferred

最新推荐文章于 2025-05-10 09:16:21 发布

星辰大海_enoch

最新推荐文章于 2025-05-10 09:16:21 发布

阅读量136

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/u012872771/article/details/103666530

本文深入探讨了JavaScript中Callbacks和Deferred对象的应用，展示了如何通过Callbacks实现观察者模式，管理多个回调函数，并介绍了Deferred对象在处理异步操作时的作用，包括其状态管理和回调函数链的设置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

callbacks 多个回调函数管理回调函数回调对象

        function wakeUp() {
    console.log('早上好')
}
function eating() {
    console.log('吃早饭')
}

var cd = $.Callbacks('unique');   // 返回一个对象 可使用add在里面添加函数
cd.add([wakeUp, wakeUp]);         // 增加wakeUp这个函数
cd.add(eating);                   // 增加eating这个函数

$('#app').click(function() {    // 点击起床
    cd.fire();                  // 触发
})

可以在不同作用域下，只要能够增加到callbacks中，触发的时候都可以执行到。

callbacks模式是观察者模式，一对多。

在执行$.Callbacks()中可以传固定的字符串关键字
once 只能fire一次
memory 前面触发过一次fire，后面添加的回调函数就会自动触发
unique 去重回调函数
stopOnFalse 如果在执行前面的时候遇到return false 那么执行结束

大致的源码:

        var cb = {
    callbacks: [],
    add: function(fn) {             // 增加
        this.callbacks.push(fn);
    },
    fire: function() {              // 触发
        this.callbacks.forEach(function(fn) {
            fn();
        })
    }
};
cb.add(function wakeUp() {
    console.log('zao');
})
cb.add(function eating() {
    console.log('chizaofan');
})
cb.fire();

deferred 延迟对象

状态:
dtd.resolve(); // 成功状态
dtd.reject(); // 失败状态
dtd.notify(); // 进行中

        var dtd = $.Deferred();     // 创建延迟对象
// dtd.resolve();   // 成功状态
// dtd.reject();   // 失败状态
dtd.notify(); // 进行中

dtd.done(su).fail(er).progress(ing);// 上面对应的状态可以调用这里对应的函数
function su() {
    console.log('成功了')
}
function er() {
    console.log('失败了')
}
function ing() {
    console.log('进行中')
}