本文实例讲述了jQuery.Callbacks()回调函数队列用法。分享给大家供大家参考,具体如下:
1、jQuery.Callbacks
The jQuery.Callbacks() function, introduced in version 1.7, returns a multi-purpose object that provides a powerful way to manage callback lists. It supports adding, removing, firing, and disabling callbacks.
The $.Callbacks() function is internally used to provide the base functionality behind the jQuery $.ajax() and $.Deferred() components. It can be used as a similar base to define functionality for new components.
接下来,我们分别看下四个标准的控制标志。
1.1 once
创建的 callbacks 对象只允许被 fireWith() 一次 [注意:方法fire() 是 fireWith() 的外观模式]。
var callbacks = $.Callbacks("once");
callbacks.add(function(){console.log("f1");});
callbacks.fire(); //输出 "f1"
callbacks.fire(); //什么也不发生,在源码中已经禁用了 list.disable()
1.2 memory
在调用 add() 方法时,如果这时 callbacks队列 满足 fired && firing = false(真执行完毕) && memory(需要在构造函数指定),那么add() 进去的回调函数会立即执行,而这个 add 进去的回调函数调用时的参数存储在 memory 变量中。memory 变量用于存储最后一次调用 callbacks.fireWith(...) 时所使用的参数 [context, arguments]。
If the Callbacks object is created with the "memory" flag as its argument, additional functions may be added and fired after the callback list is locked.
$(function($){
var callbacks = $.Callbacks("memory");
callbacks.add(function(){console.log("f1");});
callbacks.fire(); //输出 "f1",这时函数列表已经执行完毕!
callbacks.add(function(){console.log("f2");}); //memory作用在这里,没有fire,一样有结果: f2
callbacks.fire(); //重新触发一次,输出 f1 f2。 firingStart = 0
//与once一起使用
callbacks = $.Callbacks("once memory");
callbacks.add(function(){console.log("f3");});
callbacks.fire(); //输出 "f3",这时函数列表已经执行完毕!
callbacks.add(function(){console.log("f4");}); //没有fire,一样有结果: f4
callbacks.fire(); //由于为"once",这里将什么也不执行
});
1.3 unique
回调函数列表中的函数是否可以重复,该特性与 add() 方法有关,可以避免在回调函数列表中加入多个相同回调函数。
var f1 = function(){console.log("f1");};
var callbacks = $.Callbacks();
callbacks.add(f1);
callbacks.add(f1);
callbacks.fire(); //输出 f1 f1
//传递参数 "unique"
callbacks = $.Callbacks("unique");
callbacks.add(f1); //有效
callbacks.add(f1); //添加不进去
callbacks.fire(); //输出: f1
1.4 stopOnFalse
默认情况下,当执行 fireWith() 方法时,整个回调函数列表中的所有函数都会顺序执行,但如果设置了stopOnFalse,那么当某个函数返回false时,后边的函数将不再执行。即使设置了memory,再次添加的函数也不会执行了,即一旦某个函数返回 false 的情况下,会禁用 memory 功能。但如果没设置”once”,再次调用fire可以重新触发该callbacks。
var f1 = function(){console.log("f1"); return false}; //注意 return false;
var f2 = function(){console.log("f2");};
var callbacks = $.Callbacks();
callbacks.add(f1);
callbacks.add(f2);
callbacks.fire(); //输出 f1 f2
callbacks = $.Callbacks("memory stopOnFalse");
callbacks.add(f1);
callbacks.add(f2);
callbacks.fire(); //只输出 f1
callbacks.add(function(){console.log("f3");}); //不会输出,memory已经失去作用了
callbacks.fire(); //重新触发,输出f1
2. memory 回调队列
var i = 0;
var inc = function (s){
i++;
alert(i +"$" + s);
};
var callbacks = $.Callbacks('memory');
callbacks.add(function iteral() {
callbacks.add(inc);
if (i <= 1) {
callbacks.fire(i);
}
});
callbacks.fire(i);
callbacks.add(inc);
/*
list = [];
list = [it];
--->fire(0), i=0
1、list = [it, inc]
2、push(fire(0))
3、i++ [inc(0)] (i=1)
shift()--->fire(0), i=1
1、list = [it, inc, inc];
2、push(fire(1)),
3、i++ [inc(0)]
4、i++ [inc(0)] (i=3)
shift()--->fire(1),i=3
1、list = [it, inc, inc, inc];
2、i++ [inc(1)]
3、i++ [inc(1)]
4、i++ [inc(1)] (i=6)
--->add(inc), i=6, memory=[this,1]
1、i++ [inc(1)] (i=7)
*/
3、 jQuery.CallBacks 源码
说明:为了便于理解,修改了部分源码,减少了一些功能~~~
jQuery.Callbacks = function (options) {
// string --> object 改进建议:将未配置的参数缺省为false,而不是undefined。便于程序阅读和控制.
options = optionsCache[options] || createOptions(options);
var firing,
memory, //Last fire value [context, args] (for memory lists)
fired,
firingLength,
firingIndex,
firingStart,
list = [],
stack = options.once === true "function") {
// (!(options.unique && self.has(arg))) unique字段的作用
if (!options.unique || !self.has(arg)) {
list.push(arg);
}
}
});
if (firing === true) {
// 进入条件: 说明正在执行回调函数队列中,而当前执行的这个回调函数激活了add()函数,及时维护循环边界
firingLength = list.length;
} else if (memory) {
// 进入条件: memory && fired && firing === false, 说明之前的 fire() 行为已经完全结束
firingStart = originLength;
fire(memory);
}
}
return this;
},
remove: function() {
if (list) {
jQuery.each(arguments, function( _, arg) {
var lastIndex;
while ((lastIndex = jQuery.inArray(arg, list, lastIndex)) >= 0) {
list.splice(lastIndex, 1);
if (firing === true) { // 及时更新边界条件,实现智能处理
if (lastIndex <= firingLength) {
firingLength--;
}
if (lastIndex <= firingIndex) {
firingIndex--;
}
}
}
});
}
return this;
},
has: function (func) { //这个API有两个功能,根据单一职责角度来说,应该增加一个 isNotEmpty() 接口(非空)
return func "_blank" href="https://www.jb51.net/Special/200.htm">jQuery常用插件及用法总结》、《jquery中Ajax用法总结》、《jQuery表格(table)操作技巧汇总》、《jQuery拖拽特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》及《jquery选择器用法总结》
希望本文所述对大家jQuery程序设计有所帮助。
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
RTX 5090要首发 性能要翻倍!三星展示GDDR7显存
三星在GTC上展示了专为下一代游戏GPU设计的GDDR7内存。
首次推出的GDDR7内存模块密度为16GB,每个模块容量为2GB。其速度预设为32 Gbps(PAM3),但也可以降至28 Gbps,以提高产量和初始阶段的整体性能和成本效益。
据三星表示,GDDR7内存的能效将提高20%,同时工作电压仅为1.1V,低于标准的1.2V。通过采用更新的封装材料和优化的电路设计,使得在高速运行时的发热量降低,GDDR7的热阻比GDDR6降低了70%。