js bind 函数 使用闭包保存执行上下文


Posted in Javascript onDecember 26, 2011
window.name = "the window object" 
function scopeTest() { 
return this.name; 
} 
// calling the function in global scope: 
scopeTest() 
// -> "the window object" 
var foo = { 
name: "the foo object!", 
otherScopeTest: function() { return this.name } 
}; 
foo.otherScopeTest();// -> "the foo object!" 
var foo_otherScopeTest = foo.otherScopeTest; 
foo_otherScopeTest(); 
// ?> "the window object"

如果你希望将一个对象的函数赋值给另外一个变量后,这个函数的执行上下文仍然为这个对象,那么就需要用到bind方法。
bind的实现如下:
// The .bind method from Prototype.js 
Function.prototype.bind = function(){ 
var fn = this, args = Array.prototype.slice.call(arguments), object = args.shift(); 
return function(){ 
return fn.apply(object, 
args.concat(Array.prototype.slice.call(arguments))); 
}; 
};

使用示例:
var obj = { 
name: 'A nice demo', 
fx: function() { 
alert(this.name); 
} 
}; 
window.name = 'I am such a beautiful window!'; 
function runFx(f) { 
f(); 
} 
var fx2 = obj.fx.bind(obj); 
runFx(obj.fx); 
runFx(fx2);

参考:
http://www.prototypejs.org/api/function/bind
PS:
才发现prototypejs的API文档解释的这么详细,一定要花点时间多看看了。
我的简单的实现:
Function.prototype.bind = function(obj) { 
var _this = this; 
return function() { 
return _this.apply(obj, 
Array.prototype.slice.call(arguments)); 
} 
} 
var name = 'window', 
foo = { 
name:'foo object', 
show:function() { 
return this.name; 
} 
}; 
console.assert(foo.show()=='foo object', 
'expected foo object,actual is '+foo.show()); 
var foo_show = foo.show; 
console.assert(foo_show()=='window', 
'expected is window,actual is '+foo_show()); 
var foo_show_bind = foo.show.bind(foo); 
console.assert(foo_show_bind()=='foo object', 
'expected is foo object,actual is '+foo_show_bind());
Javascript 相关文章推荐
Javascript 匿名函数及其代码模式原理
Mar 19 Javascript
js文件包含的几种方式介绍
Sep 28 Javascript
微信小程序 Page()函数详解
Oct 17 Javascript
老生常谈jquery中detach()和remove()的区别
Mar 02 Javascript
js简易版购物车功能
Jun 17 Javascript
基于JS代码实现简单易用的倒计时 x 天 x 时 x 分 x 秒效果
Jul 13 Javascript
vue双向数据绑定知识点总结
Apr 18 Javascript
Node.js log4js日志管理详解
Jul 31 Javascript
JavaScript实现的级联算法示例【省市二级联动功能】
Dec 25 Javascript
详解微信小程序缓存--缓存时效性
May 02 Javascript
vue路由跳转传参数的方法
May 06 Javascript
Node.js开发之套接字(socket)编程入门示例
Nov 05 Javascript
js 函数调用模式小结
Dec 26 #Javascript
JavaScript 原型继承
Dec 26 #Javascript
jquery事件机制扩展插件 jquery鼠标右键事件。
Dec 26 #Javascript
查看源码的工具 学习jQuery源码不错的工具
Dec 26 #Javascript
初学Jquery插件制作 在SageCRM的查询屏幕隐藏部分行的功能
Dec 26 #Javascript
非常有用的40款jQuery 插件推荐(系列二)
Dec 25 #Javascript
JS代码优化技巧之通俗版(减少js体积)
Dec 23 #Javascript
You might like
PHP详细彻底学习Smarty
2008/03/27 PHP
用PHP将数据导入到Foxmail的实现代码
2010/09/05 PHP
非常实用的php弹出错误警告函数扩展性强
2014/01/17 PHP
windows服务器中检测PHP SSL是否开启以及开启SSL的方法
2014/04/25 PHP
ThinkPHP实现一键清除缓存方法
2014/06/26 PHP
php实现检查文章是否被百度收录
2015/01/27 PHP
CentOS7系统搭建LAMP及更新PHP版本操作详解
2020/03/26 PHP
JQuery的ajax基础上的超强GridView展示
2009/09/18 Javascript
JavaScript Sort 表格排序
2009/10/31 Javascript
javascript中的一些注意事项 更新中
2010/12/06 Javascript
js自动查找select下拉的菜单并选择(示例代码)
2014/02/26 Javascript
jQuery使用$.each遍历json数组的简单实现方法
2016/04/18 Javascript
JS实现间歇滚动的运动效果实例
2016/12/22 Javascript
用jQuery将JavaScript对象转换为querystring查询字符串的方法
2018/11/12 jQuery
一文快速了解JQuery中的AJAX
2019/05/31 jQuery
vue 使用axios 数据请求第三方插件的使用教程详解
2019/07/05 Javascript
微信小程序实现图片选择并预览功能
2019/07/25 Javascript
layui递归实现动态左侧菜单
2019/07/26 Javascript
vue请求数据的三种方式
2020/03/04 Javascript
对于Python的框架中一些会话程序的管理
2015/04/20 Python
Python2.7读取PDF文件的方法示例
2017/07/13 Python
pytorch cnn 识别手写的字实现自建图片数据
2018/05/20 Python
Python实现滑动平均(Moving Average)的例子
2019/08/24 Python
浅谈Django前端后端值传递问题
2020/07/15 Python
CSS 说明横向进度条最后显示文字的实现代码
2020/11/10 HTML / CSS
改变生活的男士内衣:SAXX Underwear
2019/08/28 全球购物
Linux面试经常问的文件系统操作命令
2016/10/04 面试题
机械专业毕业生自荐信
2013/11/02 职场文书
教师岗位职责
2013/11/17 职场文书
十佳文明家庭事迹
2014/05/25 职场文书
微笑面对生活演讲稿
2014/09/23 职场文书
小区环境卫生倡议书
2015/04/29 职场文书
2016年“5.12”护士节慰问信
2015/11/30 职场文书
Mysql MVCC机制原理详解
2021/04/20 MySQL
python使用XPath解析数据爬取起点小说网数据
2021/04/22 Python
快速学习Oracle触发器和游标
2021/06/30 Oracle