Function.bind 方法
this.num = 9;
var mymodule = {
num: 81,
getNum: function() { return this.num; }
}; module.getNum(); // var getNum = module.getNum;
getNum(); // 9, 因为在这个例子中,"this"指向全局对象 // 创建一个'this'绑定到module的函数
var boundGetNum = getNum.bind(module);
boundGetNum(); //
if(!Function.prototype.bind){
Function.prototype.bind = function(oThis){
if(typeof this !=="function"){ //如果不函数抛出异常
throw new TyperError("")
}
var aArgs = Array.prototype.slice.call(arguments,1), //此处的aArgs是除函数外的参数
fToBind = this, //要绑定的对象
fNOP = function(){},
fBound = function(){
return fToBind.apply(
//没看清楚为什么要 this. instanceof fNOP ? this: oThis, 应该直接OThis吧
this instanceof fNOP ? this:oThis||this, aArgs.concat(Array.prototype.slice.call(arguments)) 参数合并 );
)
};
fNOP.prototype = this.prototype; // 利用中间函数 fNOP 来借用 被执行函数ABC的原型
fBound.prototype = new fNOP(); // 因为 new FNOP ( ) 这个实例有个属性 __proto__ 指向了 fNOP的原型, 这样改变fBound的原型不会影响到 被执行函数ABC的原型
return fBound;
}
}
明白 bind 的用法就必须要知道 apply 的用法,MDN 指出,apply 是直接修改了函数内部的指向到第一个参数,并将第二个参数数组传参进函数并运行这个函数。也就是说
var obj = {test: function() { console.log(this, arguments) }},
func = obj.test;
obj.test("Hello", ",", "world", "!");
func.apply(obj, ["Hello", ",", "world", "!"]);
这两种运行方式是一样的。那么回到 Polyfill 中发现参数的写法是 args.concat(slice.call(arguments))。args 是将 bind时候定义的除第一个参数外的其它参数,而此时的 arguments 是指函数调用时候的参数,通过数组的操作将这两个参数合并成一个数组传入函数内部。看个例子你可能更容易明白:
/** 代码接上 **/
var newFunc = func.bind(obj, "Hello", ",");
newFunc("world", "!");
那么再来回答问题一,这个是典型的属性继承的方法,本来使用
bound.prototype = self.prototype
就可以将原属性集成过来了,但是这样两个对象属性都指向同一个地方,修改 bound.prototype 将会造成 self.prototype也发生改变,这样并不是我们的本意。所以通过一个空函数 nop 做中转,能有效的防止这种情况的发生。
bind返回的是函数
if (!Function.prototype.bind) {
Function.prototype.bind = function(obj) {
var _self = this
,args = arguments;
return function() {
_self.apply(obj, Array.prototype.slice.call(args, 1));
}
}
}
Function.bind 方法的更多相关文章
- ES6下的Function.bind方法
在JavaScript的使用中,this的指向问题始终是一个难点.不同的调用方式,会使this指向不同的对象.而使用call,apply,bind等方式,可改变this的指向,完成一些令人惊叹的黑魔法 ...
- 解决function.bind()方法
这个 bind 方法只有在 ie10 版本的浏览器才得到原生支持,低于该版本的浏览器下执行时会得到一个 undefined 的错误提示. 于是只好再次上网 google 解决方案,功夫不负有心人,我们 ...
- IE8支持function.bind()方法
这个 bind 方法仅仅有在 ie10 版本号的浏览器才得到原生支持,低于该版本号的浏览器下运行时会得到一个 undefined 的错误提示.于是仅仅好再次上网 google 解决方式,功夫不负有心人 ...
- 浅析 JavaScript 中的 Function.prototype.bind() 方法
Function.prototype.bind()方法 bind() 方法的主要作用就是将函数绑定至某个对象,bind() 方法会创建一个函数,函数体内this对象的值会被绑定到传入bind() 函数 ...
- prototype.js中Function.prototype.bind方法浅解
prototype.js中的Function.prototype.bind方法: Function.prototype.bind = function() { var __method = this; ...
- JavaScript 中的 Function.prototype.bind() 方法
转载自:https://www.cnblogs.com/zztt/p/4122352.html Function.prototype.bind()方法 bind() 方法的主要作用就是将函数绑定至某个 ...
- js学习进阶中-bind()方法
有次面试遇到的,也是没说清楚具体的作用,感觉自己现在还是没有深刻的理解! bind():绑定事件类型和处理函数到DOM element(父元素上) live():绑定事件到根节点上,(document ...
- Javascript中call,apply,bind方法的详解与总结
在 javascript之 this 关键字详解 文章中,谈及了如下内容,做一个简单的回顾: 1.this对象的涵义就是指向当前对象中的属性和方法. 2.this指向的可变性.当在全局作用域时,thi ...
- 【转载】JS中bind方法与函数柯里化
原生bind方法 不同于jQuery中的bind方法只是简单的绑定事件函数,原生js中bind()方法略复杂,该方法上在ES5中被引入,大概就是IE9+等现代浏览器都支持了(有关ES5各项特性的支持情 ...
随机推荐
- 算法+OpenCV】基于opencv的直线和曲线拟合与绘制(最小二乘法)
http://blog.csdn.net/guduruyu/article/details/72866144 最小二乘法多项式曲线拟合,是常见的曲线拟合方法,有着广泛的应用,这里在借鉴最小二乘多项式曲 ...
- Python面试题之Python反射机制
0x00 前言 def f1(): print('f1') def f2(): print('f2') def f3(): print('f3') def f4(): print('f4') a = ...
- PHP(Mysql/Redis)消息队列的介绍及应用场景案例
在进行网站设计的时候,有时候会遇到给用户大量发送短信,或者订单系统有大量的日志需要记录,还有做秒杀设计的时候,服务器无法承受这种瞬间的压力,无法正常处理,咱们怎么才能保证系统正常有效的运行呢?这时候我 ...
- nodeJs和JavaScript的异同
JavaScript组成:ECMAScript(定义这门语言的基础,比如语法.数据类型.结构以及一些内置对象等).DOM(基于ECMASCRIPT,扩展出来的用于操作页面元素的方法).BOM(基于EC ...
- Leetcode——Third Maximum Number
Question Given a non-empty array of integers, return the third maximum number in this array. If it d ...
- JDK 中的监控与故障处理工具-05 (jstack)
jstack : stack trace for java jstack 命令用于生成虚拟机当前时刻的线程快照 (threaddump).线程快照是当前虚拟机中每一条线程正在执行的方法堆栈的集合,生成 ...
- UVA 12657 Boxes in a Line(双向链表+小技巧)
题意:对于一行按照顺序排列盒子数字与位置都为 1,2,3,4....n 执行四种操作 c = 1 x 放到 y 的左边 c =2 x 放到 y 的右边 c =3 交换 x, y c =4 ...
- codeforces 484B - LubaAndTicket - 贪心
2017-08-22 10:54:00 writer:pprp 题意如下: 给你6个数组,你的操作可以是更改某一位的数字成为0-9之间任意一个数,要求前三个数字的和与后三个数字的和相等. 问你最少用几 ...
- Mac Homebrew安装php56 到phpstorm过程问题汇总
Mac自带版本是php5.5,本来是用homebrew安装xdebug 命令:brew install php55-xdebug 但是安装之后使用phpstorm还是有问题.php -v 并没有显示有 ...
- python 编程测试练习2
1.将A.txt(多行)文件的内容读取出来写入到B.txt中 2.总结 一.python中对文件.文件夹操作时经常用到的os模块和shutil模块常用方法. 1.得到当前工作目录,即当前Python脚 ...