在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 相关文章推荐
JS控制表格隔行变色
Jun 26 Javascript
复制本贴标题和地址的js代码
Jul 01 Javascript
js css后面所带参数含义介绍
Aug 18 Javascript
js中split函数的使用方法说明
Dec 26 Javascript
JQuery与Ajax调用新浪API获取短网址的代码
Feb 07 Javascript
深入理解JavaScript中为什么string可以拥有方法
May 24 Javascript
JavaScript-html标题滚动效果的简单实现
Sep 08 Javascript
jQuery实现扑克正反面翻牌效果
Mar 10 Javascript
vue 2.0项目中如何引入element-ui详解
Sep 06 Javascript
Vue render渲染时间戳转时间,时间转时间戳及渲染进度条效果
Jul 27 Javascript
微信小程序云开发之使用云函数
May 17 Javascript
redux处理异步action解决方案
Mar 22 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
探讨:使用XMLSerialize 序列化与反序列化
2013/06/08 PHP
PHP多个图片压缩成ZIP的方法
2020/08/18 PHP
从javascript语言本身谈项目实战
2006/12/27 Javascript
js中匿名函数的N种写法
2010/09/08 Javascript
ajax异步刷新实现更新数据库
2012/12/03 Javascript
js禁止页面复制功能禁用页面右键菜单示例代码
2013/08/29 Javascript
javascript动态添加、修改、删除对象的属性与方法详解
2014/01/27 Javascript
Jquery图片延迟加载插件jquery.lazyload.js的使用方法
2014/05/21 Javascript
自己动手手写jQuery插件总结
2015/01/20 Javascript
Node.js实现JS文件合并小工具
2016/02/02 Javascript
Vue.js第三天学习笔记(计算属性computed)
2016/12/01 Javascript
详解自动生成博客目录案例
2016/12/09 Javascript
详解nodejs 文本操作模块-fs模块(三)
2016/12/22 NodeJs
微信小程序 石头剪刀布实例代码
2017/01/04 Javascript
JavaScript获取tr td 的三种方式全面总结(推荐)
2017/08/15 Javascript
vue2.0模拟锚点的实例
2018/03/14 Javascript
学习python (1)
2006/10/31 Python
Python字符转换
2008/09/06 Python
python将html转成PDF的实现代码(包含中文)
2013/03/04 Python
Python基于回溯法子集树模板解决最佳作业调度问题示例
2017/09/08 Python
Python使用pymongo库操作MongoDB数据库的方法实例
2019/02/22 Python
python中open函数的基本用法示例
2019/09/07 Python
Python 中list ,set,dict的大规模查找效率对比详解
2019/10/11 Python
PyQt5多线程刷新界面防假死示例
2019/12/13 Python
python中pop()函数的语法与实例
2020/12/01 Python
HTML5 Canvas实现360度全景图的示例代码
2018/01/29 HTML / CSS
Java中会存在内存泄漏吗,请简单描述
2016/12/22 面试题
护士自荐信怎么写
2013/10/18 职场文书
大专计算机个人求职的自我评价
2013/10/21 职场文书
《陈毅探母》教学反思
2014/05/01 职场文书
离婚纠纷代理词
2015/05/23 职场文书
单位病假条范文
2015/08/17 职场文书
oracle覆盖导入dmp文件的2种方法
2021/05/21 Oracle
MySQL 重命名表的操作方法及注意事项
2021/05/21 MySQL
MySQL命令无法输入中文问题的解决方式
2021/08/30 MySQL
收音机爱好者玩机13年,简评其使用过的19台收音机
2022/04/30 无线电