关于原生js中bind函数的实现
今天继续研究了bind函数的实现,也知道了shim和polyfill的说法,现在总结一下,
 if (!Function.prototype.bind) {
   Function.prototype.bind = function (oThis) {
     if (typeof this !== "function") {
       // closest thing possible to the ECMAScript 5 internal IsCallable function
       throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
     }
     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;
   };
 }
这是官方文档上的实现,我分二个方面来谈我要说的东西,
第一个是参数,agruments的使用
var aArgs = Array.prototype.slice.call(arguments, 1),
这里是将bind函数的参数数组取出来,第一个参数不要(就是不要oThis)也就是要被绑定方法的那个对象,第二个是
aArgs.concat(Array.prototype.slice.call(arguments)));
这里是用了数组的方法,把参数插在参数数组后面,要注意,这个函数是要被return 出去然后执行的,他的参数数组是return出去的那个fBound函数的参数数组,所以上下两个参数数组是不一样的,有点像柯里化。
第二个是上下文,在其中上下文的变化比较难理解,bind函数主要就是为了绑定上下文来使用的
fToBind = this
这里是保存了对象的上下文,紧接着下面的apply方法让要被绑定的那个对象可以使用该上下文
fNOP.prototype = this.prototype;
fBound.prototype = new fNOP();
这里是以fNOP为中介把this.prototype这个原对象的属性给fBound,确保fBound是在定义的时候的那个上下文里面执行。本来
bound.prototype = self.prototype
就可以将原属性集成过来了,但是这样两个对象属性都指向同一个地方,修改 bound.prototype 将会造成self.prototype 也发生改变,这样并不是我们的本意。所以通过一个空函数 nop 做中转,能有效的防止这种情况的发生。
关于原生js中bind函数的实现的更多相关文章
- 原生JS实现bind()函数
		
一.bind()函数的两个特性: 1.bind和curring,函数科里化 function add(a, b, c) { var i = a+b+c; console.log(i); return ...
 - 【转载】JS中bind方法与函数柯里化
		
原生bind方法 不同于jQuery中的bind方法只是简单的绑定事件函数,原生js中bind()方法略复杂,该方法上在ES5中被引入,大概就是IE9+等现代浏览器都支持了(有关ES5各项特性的支持情 ...
 - 关于原生js中函数的三种角色和jQuery源码解析
		
原生js中的函数有三种角色: 分两大种: 1.函数(最主要的角色)2.普通对象(辅助角色):函数也可以像对象一样设置属于本身的私有属性和方法,这些东西和实例或者私有变量没有关系两种角色直接没有必然的关 ...
 - js中bind解析
		
一.arguments的含义 // arguments 是一个对应于传递给函数的参数的类数组对象 function a(){ console.log(arguments); } a(); // Arg ...
 - js中getByClass()函数
		
js中getByClass()函数进化史 对于js来说,我想每一个刚接触它的人都应该会抱怨:为什么没有一个通过class来获取元素的方法.尽管现在高版本的浏览器已经支持getElementsByCla ...
 - 原生JS封装_new函数,实现new关键字的功能
		
1.前言 众所周知:没有对象怎么办?那就new一个! 那么在JS中,当我们new一个对象的时候,这个new关键字内部都干了什么呢? 现在我们就来剖析一下原生JS中new关键字内部的工作原理. 2.原生 ...
 - 原生JS中apply()方法的一个值得注意的用法
		
今天在学习vue.js的render时,遇到需要重复构造多个同类型对象的问题,在这里发现原生JS中apply()方法的一个特殊的用法: var ary = Array.apply(null, { &q ...
 - JS中的函数,Array对象,for-in语句,with语句,自定义对象,Prototype
		
一)函数 A)JS中的函数的定义格式: function add(a,b) { var sum = a+b; document.write("两个数的和是:" + sum); // ...
 - js中的函数,Date对象,Math对象和数组对象
		
函数就是完成某个功能的一组语句,js中的函数由关键字 function + 函数名 + 一组参数定义;函数在定义后可以被重复调用,通常将常用的功能写成一个函数,利用函数可以使代码的组织结构更多清晰. ...
 
随机推荐
- Android开发技巧——使用Dialog实现仿QQ的ActionSheet菜单
			
最近看到有人用Dialog来实现QQ的仿ActionSheet的自定义菜单,对于自己没实现过的一些控件,看着也想实现一下.于是动手了一下,发现也不难,和大家分享一下. 本文原创,转载请注明出处:htt ...
 - JSP 知识基本
			
from:http://blog.csdn.net/caipeichao2/article/details/38589293 more:http://www.2cto.com/kf/web/jsp/4 ...
 - obj-c中SEL签名和Invocation示例
			
参考小示例,代码如下: #import <Foundation/Foundation.h> @interface PlayList:NSObject @property NSMutable ...
 - 让opencv程序在没有安装opencv的电脑上运行
			
经常需要把用opencv写的程序拿到没有装opencv的电脑上去运行和演示,要让opencv程序脱离opencv环境,一般有两种方法: 一种是动态链接opencv,即把相应的dll拷贝到exe所在目录 ...
 - LeetCode之旅(13)-Valid Anagram
			
题目介绍: Given two strings s and t, write a function to determine if t is an anagram of s. For example, ...
 - 使用vs2010 opencv2.4.4编译release版本程序
			
大体上要注意一下几点内容: 1.vc++目录的选择上,库目录选择为opencv目录中的staticlib目录 2.在链接->输入->附加依赖库,中添加,相应的staticlib库目录中的所 ...
 - Python_linux环境变量和软链接(个人理解)
			
--------------------------------------- 最近在服务器上想运行个脚本,装了个python3.6,但是他还自带了个2.7版本,后来发现上面还有3.5版本的pytho ...
 - mysql海量数据的优化
			
转载:https://www.cnblogs.com/trying/archive/2013/08/15/3259126.html 下面是一部分比较重要的建议:1.选择正确的存储引擎以 MySQL为例 ...
 - MySQL/MariaDB的锁
			
本文目录: 1.MariaDB/MySQL事务提交的方式 2.MariaDB/MySQL中的锁简介 2.1 不同存储引擎支持的锁级别 2.2 锁类型 2.3 锁兼容性 3.MyISAM的表级锁(loc ...
 - python---生成器、迭代器
			
# -*- coding:utf-8 -*- # LC # 列表生成式 def func(x): print(x) return 2*x print([ func(i) for i in range( ...