JavaScript Patterns 4.2 Callback Pattern
function writeCode(callback) { // do something... callback(); // ... } function introduceBugs() { // ... make bugs } writeCode(introduceBugs);
A Callback Example
// refactored findNodes() to accept a callback var findNodes = function (callback) { var i = 100000, nodes = [], found; // check if callback is callable if (typeof callback !== "function") { callback = false; } while (i) { i -= 1; // complex logic here... // now callback: if (callback) { callback(found); } nodes.push(found); } return nodes; };
Callbacks and Scope
var myapp = {}; myapp.color = "green"; myapp.paint = function (node) { node.style.color = this.color; };
The function findNodes() does something like this:
var findNodes = function (callback) { // ... if (typeof callback === "function") { callback(found); } // ... };
If you call findNodes(myapp.paint), it won’t work as expected, because this.color will not be defined. The object this will refer to the global object, because findNodes() is a global function. If findNodes() were a method of an object called dom (like dom.findNodes()), then this inside of the callback would refer to dom instead of the expected myapp.
pass the callback function and in addition pass the object this callback belongs to
findNodes(myapp.paint, myapp); var findNodes = function (callback, callback_obj) { //... if (typeof callback === "function") { callback.call(callback_obj, found); } // ... };
pass the method as a string
findNodes("paint", myapp); var findNodes = function (callback, callback_obj) { if (typeof callback === "string") { callback = callback_obj[callback]; } //... if (typeof callback === "function") { callback.call(callback_obj, found); } // ... };
Asynchronous Event Listeners
document.addEventListener("click", console.log, false);
Timeouts
var thePlotThickens = function () { console.log('500ms later...'); }; setTimeout(thePlotThickens, 500);
Callbacks in Libraries
Focus on core functionality and provide “hooks” in the form of callbacks, which will allow the library methods to be easily built upon, extended, and customized.
最新文章
- 详解jQ的support模块
- truncate 空间不释放问题
- html表格table设置边框
- Java Project部署到Tomcat服务器上
- 达到J2EE在后台action控制接待javascript弹出的对话框
- gcc与g++的区别与联系
- C++中lower_bound函数和upper_bound函数
- SuperSocket基础(二)-----一个完成SocketServer项目
- Android:Error:Execution failed for task ':app:transformResourcesWithMergeJavaResForDebug'.
- while100以内的偶数
- Jfinal控制器源码解读
- .Net 使用爬虫下载网络图片到本地磁盘
- Handler Looper 解析
- 手动实现一个虚拟DOM算法
- 【POI每日题解 #9】SKA-Piggy Banks
- apiCloud 播放视频
- Java代理:静态代理、动态代理
- ngIf和ngFor共用
- date命令转换日期命令提示date: illegal time format
- hadoop集群默认配置和常用配置