模拟实现兼容低版本IE浏览器的原生bind()函数功能
if(!Function.prototype.bind){ Function.prototype.bind=function(oThis){ if (typeof this !== 'function'){ throw new TypeError('调用者不是当前函数对象'); } var aArgs = Array.prototype.slice.call(arguments, 1), fToBind = this, fNOP = function() {}, fBound = function() { return fToBind.apply(this instanceof fNOP && oThis ? this : oThis||window, aArgs.concat(Array.prototype.slice.call(arguments))); }; fNOP.prototype = this.prototype; fBound.prototype = new fNOP(); return fBound; };}一.代码注释:
1.if(!Function.prototype.bind),判断当前浏览器是否支持bind()函数。
2.Function.prototype.bind=function(oThis){},如果不支持的话,就添加一个bind函数,参数自然是this要指向的对象。
3.if (typeof this !== 'function'){
throw new TypeError('调用者不是当前函数对象');
},因为使用call或者apply等方式的存在,可以将调用者转换成其他对象,比如func.bind.call(obj),就是为了防止此情况的出现。
4.var aArgs = Array.prototype.slice.call(arguments, 1),获取为bind函数传递的从第二个开始以后的参数。
5.fToBind = this,将当前函数对象的this引用赋值给变量fToBind 。
6.fNOP = function() {},使用表达式方式创建一个函数,它的用法在后面介绍。
7.fBound = function() {
return fToBind.apply(this instanceof fNOP && oThis ? this : oThis||window ,
aArgs.concat(Array.prototype.slice.call(arguments)));
},fBound函数就是要返回的函数。return fToBind.apply()前面加上return是因为fToBind函数可能会有返回值。
this instanceof fNOP && oThis ? this : oThis||window,this instanceof fNOP可以判断是否用作构造函数,至于&&与运算符后面的oThis 是否需要值得商榷,如果按照MDN的源码的话,当用作构造函数不传递oThis参数的时候,那么会用window对象调用fToBind函数,如果此位置 没有oThis,那么无论是否bind()函数传递oThis参数,函数fBound用作构造函数的时候,都能够使用this调用fToBind()函 数。
aArgs.concat(Array.prototype.slice.call(arguments)),两个数组进行连接,最终结果就是要传递给fToBind()函数的参数。
8.fNOP.prototype = this.prototype,此句感觉完全没有必要,可能是为了增加原型链的密度。
9.fBound.prototype = new fNOP(),将fBound的原型对象设置为fNOP()的实例对象,这样的话如果fBound 用作构造函数的话,this instanceof fNOP返回值为true。
10.return fBound,返回此函数。
模拟实现兼容低版本IE浏览器的原生bind()函数功能的更多相关文章
- 兼容低版本IE浏览器的一些心得体会(持续更新)
前言: 近期工作中,突然被要求改别人的代码,其中有一项就是兼容IE低版本浏览器,所以优雅降级吧. 我相信兼容低版本IE是许多前端开发的噩梦,尤其是改别人写的代码,更是痛不欲生. 本文将介绍一些本人兼容 ...
- HTML5中的语义标签兼容IE8以及更低版本的浏览器
看某教程,说让HTML5的这些语义标签能够兼容低版本的浏览器,原文是“你可以设置css的display属性为block”.很好理解,就设置css样式为block嘛,那就直接设置咯: header, s ...
- Fundebug前端JavaScript插件更新至1.8.0,兼容低版本的Android浏览器
摘要: 兼容低版本Android浏览器,请大家及时更新. Fundebug前端BUG监控服务 Fundebug是专业的程序BUG监控平台,我们JavaScript插件可以提供全方位的BUG监控,可以帮 ...
- Vue2+Webpack+ES6 兼容低版本浏览器(IE9)解决方案
Vue2+Webpack+ES6 兼容低版本浏览器(IE9)解决方案 解决方式:安装 "babel-polyfill" 即可. 命令:npm install --save-dev ...
- 使用html5兼容低版本浏览器
因为html5 新出的一些语义化的标签,在低版本浏览器下不能识别,举个例子,比如你写了一个 header 标签中,写了一段文本,在低版本浏览器下,肯定是能看到的,但是,那是他是不认识 header标签 ...
- split方法在低版本IE浏览器上无法解析的问题
前一篇不知道怎么被博客园给删了,重新补发一个. 最近在项目中发现一个很诡异的问题,通过js获取cookie时,发现赋给用户name的时候IE9和低于9以下的浏览器对比时获取到的名字不一样,通过调试发现 ...
- 解决opacity属性在低版本IE浏览器下失效的方法
以前,一直都以为ie9以下的版本不支持opacity属性.所以就同时使用 opacity和ie独特的filter蒙版.但是有些时候需要一些动态的效果,就比如层的渐渐消失,隐藏,就需要使用动态变化的op ...
- android 在使用ViewAnimationUtils.createCircularReveal()无法兼容低版本的情况下,另行实现圆形scale动画
ViewAnimationUtils.createCircularReveal()的简介: ViewAnimationUtils.createCircularReveal()是安卓5.0才引入的,快速 ...
- 低版本IE浏览器 input元素出现叉叉的情况
都说是IE10之上的浏览器才有这个问题,恰巧我IE10之上都没有问题,反而是低版本的浏览器出现了这个问题.作为一个凭证,我先放一张图片在这里面. 之前无意中解决过这个问题,如今复现确实是没有解决,网上 ...
随机推荐
- JSP 相关试题(二)
填空题 1.W3C是指___万维网联盟_______. 2.Internet采用的通信协议是___TCP/IP___. 3.当今比较流行的技术研发模式是__C/S__和__B/S__的体系结构来实现的 ...
- asp.net中virtual和abstract的区别分析
这篇文章主要介绍了asp.net中virtual和abstract的区别,较为详细的分析了virtual与abstract的概念与具体用法,并以实例的形式予以总结归纳,需要的朋友可以参考下 本文实例分 ...
- 自动扫描FTP文件工具类 ScanFtp.java
package com.util; import java.io.BufferedInputStream; import java.io.BufferedOutputStream; import ja ...
- C#的浅拷贝和深拷贝
C#中有两种类型变量,一种 是值类型变量,一种是引用类型变量 对于值类型变量,深拷贝和前拷贝都是通过赋值操作符号(=)实现,其效果一致,将对象中的值类型的字段拷贝到新的对象中.这个很容易理解. 本文重 ...
- C++11中的Lambda表达式
原文地址:C++中的Lambda表达式 作者:果冻想 一直都在提醒自己,我是搞C++的:但是当C++11出来这么长时间了,我却没有跟着队伍走,发现很对不起自己的身份,也还好,发现自己也有段时间没有写C ...
- 【控件扩展】带圆角、边框、渐变的panel
下载地址: http://files.cnblogs.com/chengulv/custompanel_demo.zip using System; namespace LC.Fun { /// & ...
- Struts2 - Study 1
领略下传说中的Struts2,写了个小例子,有点意思.比起.net中的MVC有意思的在于它是你自己一步步去配置实现,想怎么搞就怎么搞,.net的MVC,它干了什么事你完全不知,只不过知道怎么用而已. ...
- [ZZ] MATLAB中Legend的一些控制方法
http://www.eetop.cn/blog/html/03/6503-23349.html 如果一个图中我们画了n条曲线,但是我们只想加图例说明(legend)的只有m条 (m<n).网上 ...
- Enable EPEL Repository for RHEL/CentOS 7.x/6.x/5.x
This howto guide shows you’ll how to enable EPEL repository under RHEL/CentOS 6/5 to install additio ...
- Linux下dig命令使用
Dig简介: Dig是一个在类Unix命令行模式下查询DNS包括NS记录,A记录,MX记录等相关信息的工具.由于一直缺失Dig man page文档,本文就权当一个dig使用向导吧. Dig的 ...