在JavaScript中正确引用bind方法的应用


Posted in Javascript onMay 11, 2015

 在JavaScript中,方法往往涉及到上下文,也就是this,因此往往不能直接引用,就拿最常见的console.log("info…")来说,避免书写冗长的console,直接用log("info…")代替,不假思索的会想到如下语法:

var log = console.log;
 log("info…");

     很遗憾,运行报错:TypeError: Illegal invocation。

     为啥呢?对于console.log("info…")而言,log方法在console对象上调用,因此log方法中的this指向console对象;而我们用log变量指向console.log方法,然后直接调用log方法,此时log方法的this指向的是window对象,上下文不一致,当然会报错了。

     此时我们可以用bind方法解决这个问题。bind方法允许手动传入一个this,作为当前方法的上下文,然后返回持有上下文的方法,例如:

var log = console.log.bind(console);
 log("info...");

     这样就不会报错了。

     但是,bind方法并不支持ie 8以及更低版本的浏览器,我们完全可以自己实现一个,很简单。

Function.prototype.bind = Function.prototype.bind || function(context){
   var _this = this;
   
   return function(){
     _this.apply(context, arguments);
   };
 };

     核心通过apply方法实现,闭包的经典应用。_this指向当前方法,context指向当前方法的上下文,二者均通过闭包访问。

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
THREE.JS入门教程(5)你应当知道的十件事
Jan 24 Javascript
alert和confirm功能介绍
May 21 Javascript
JS应用正则表达式转换大小写示例
Sep 18 Javascript
JS+CSS实现简易实用的滑动门菜单效果
Sep 18 Javascript
JS功能代码集锦
May 04 Javascript
浅谈Jquery中Ajax异步请求中的async参数的作用
Jun 06 Javascript
jQuery 限制输入字符串长度
Jun 20 Javascript
使用Webpack提高Vue.js应用的方式汇总(四种)
Jul 10 Javascript
重学JS 系列:聊聊继承(推荐)
Apr 11 Javascript
vue路由传参页面刷新参数丢失问题解决方案
Oct 08 Javascript
JS实现简单打字测试
Jun 24 Javascript
Vue使用CDN引用项目组件,减少项目体积的步骤
Oct 30 Javascript
jQuery实现页面内锚点平滑跳转特效的方法总结
May 11 #Javascript
javascript实现验证IP地址等相关信息代码
May 10 #Javascript
招聘网站基于jQuery实现自动刷新简历
May 10 #Javascript
javascript实现获取字符串hash值
May 10 #Javascript
Javascript实现计算个人所得税
May 10 #Javascript
AngularJS基础知识笔记之表格
May 10 #Javascript
AngularJS基础知识笔记之过滤器
May 10 #Javascript
You might like
PHP页面间传递参数实例代码
2008/06/05 PHP
php 无法加载mysql的module的时候的配置的解决方案引发的思考
2012/01/27 PHP
PHP获取指定日期是星期几的实现方法
2016/11/30 PHP
如何直接访问php实例对象中的private属性详解
2017/10/12 PHP
windows环境下使用Composer安装ThinkPHP5
2018/05/18 PHP
提高Laravel应用性能方法详解
2019/06/24 PHP
总结一些js自定义的函数
2006/08/05 Javascript
Jquery 一次处理多个ajax请求的代码
2011/09/02 Javascript
jQuery on方法传递参数示例
2014/12/09 Javascript
JS获取文件大小方法小结
2015/12/08 Javascript
JS动态改变浏览器标题的方法
2016/04/06 Javascript
浅谈js的url解析函数封装
2016/06/28 Javascript
微信小程序开发探究
2016/12/27 Javascript
jquery表单提交带错误信息提示效果
2017/03/09 Javascript
jquery中封装函数传递当前元素的方法示例
2017/05/05 jQuery
详解组件库的webpack构建速度优化
2018/06/18 Javascript
解决vue脚手架项目打包后路由视图不显示的问题
2018/09/20 Javascript
微信小程序实现打开并下载服务器上面的pdf文件到手机
2019/09/20 Javascript
js中script的上下放置区别,Dom的增删改创建操作实例分析
2019/12/16 Javascript
Python的面向对象思想分析
2015/01/14 Python
Python3 加密(hashlib和hmac)模块的实现
2017/11/23 Python
Python获取Redis所有Key以及内容的方法
2019/02/19 Python
Python爬虫实现爬取百度百科词条功能实例
2019/04/05 Python
django 邮件发送模块smtp使用详解
2019/07/22 Python
浅析pip安装第三方库及pycharm中导入第三方库的问题
2020/03/10 Python
解决python运行启动报错问题
2020/06/01 Python
Pytorch框架实现mnist手写库识别(与tensorflow对比)
2020/07/20 Python
利用css3径向渐变做一张优惠券的示例
2018/03/22 HTML / CSS
中国电子产品批发商/跨境电商/外贸网:Sunsky-online
2020/04/20 全球购物
大学生个人求职信范文
2013/09/21 职场文书
给校长的建议书600字
2014/05/15 职场文书
询价采购方案
2014/06/09 职场文书
教师民族团结演讲稿
2014/08/27 职场文书
校车司机安全责任书
2015/05/11 职场文书
毕业设计致谢语
2015/05/14 职场文书
如何使用PyCharm及常用配置详解
2021/06/03 Python