1.bind、call、apply三者的区别:
  1)bind的返回值是一个函数体,不会被立即调用
  2)call、apply会立即调用,第一个参数都是用来改变this的指向,两者的区别是前者传递参数的时候是一个一个传递,后者是以一个数组的形式传递
  3)bind、call、apply这三个方法都属于函数(Function)的方法
2.bind的封装:
bind的特点:(1)返回一个函数体(2)改变this的指向(3)传递参数
原装的bind方法可以实现:(1)this的改变(2)可以继承自身的原型方法(3)new自身之后this指向构造函数也就是自身(构造函数的this指向实例对象)

Function.prototype.bindTo = function(){
//传递过来的第一个参数,即需要改变的this指向(使用arguments形参副本来接收所有的参数)
var that = arguments[0];
//获取到剩余的参数
//slice方法是将数组进行分割,参数为1是代表从数组的第二项开始分割,一直到数组的最后一项
var arr = Array.prototype.slice.call(arguments).slice(1);
var _this = this;//当前的this指向bindTo这个函数
var fn = function(){
//将当前指向bindTo函数的this进行改变,that表示需要更改的this指向,通过apply方法来改变
//arr为需要传递的其他参数
//this instanceof fn判断的是当前是否被new过,如果new过了,则此时this应该指向构造函数本身(构造函数的this指向实例化对象),而this正好指向当前的bindTo函数;如果没有new过,则此时this应该指向传递过来的参数(实现改变this的指向)
var newThis = this instanceof fn?this:that;
_this.apply(newThis ,arr);
}
//实现继承
fn.prototype = {
constructor:fn,
__proto__:this.prototype
}
return fn;
}

执行:

function Fn(a,b,c){
console.log(this,a,b,c);
}
Fn.prototype = {
show(){}
}
var fn1 = Fn.bindTo(document);//原来的this是指向window的,在使用了bindTo方法后可以将this指向document
var p = new fn1();//new了之后会将this指向Fn(),即构造函数自身(构造函数的this指向实例对象)
console.log(p);//打印p后可以继承show()原型方法

bind的封装的更多相关文章

  1. 使用C++11的function/bind组件封装Thread以及回调函数的使用

    之前在http://www.cnblogs.com/inevermore/p/4008572.html中采用面向对象的方式,封装了Posix的线程,那里采用的是虚函数+继承的方式,用户通过重写Thre ...

  2. 使用C++11封装线程池ThreadPool

    读本文之前,请务必阅读: 使用C++11的function/bind组件封装Thread以及回调函数的使用 Linux组件封装(五)一个生产者消费者问题示例   线程池本质上是一个生产者消费者模型,所 ...

  3. Backbone.js源码分析(珍藏版)

    源码分析珍藏,方便下次阅读! // Backbone.js 0.9.2 // (c) 2010-2012 Jeremy Ashkenas, DocumentCloud Inc. // Backbone ...

  4. 玩转Java对象和XML相互转换

    最近在项目中一直出现Java对象和XML之间的相互转换,一开始由于项目很庞大,我又是临时调度过去,导致在按照项目组长的要求进行写代码的同时,总是在这块云里雾里,最近才慢慢开始搞清楚项目中具体的使用缘由 ...

  5. Hadoop中的RPC

    基于hadoop2.6.4,RPC相关的实现位于hadoop-common这个project中hadoop-common-project/hadoop-common/src/main/java的包pa ...

  6. 前端MVC Vue2学习总结(六)——axios与跨域HTTP请求、Lodash工具库

    一.axios Vue更新到2.0之后宣告不再对vue-resource更新,推荐使用axios,axios是一个用于客户端与服务器通信的组件,axios 是一个基于Promise 用于浏览器和 no ...

  7. 精读《React PowerPlug 源码》

    1. 引言 React PowerPlug 是利用 render props 进行更好状态管理的工具库. React 项目中,一般一个文件就是一个类,状态最细粒度就是文件的粒度.然而文件粒度并非状态管 ...

  8. 网上找的Backbone.js

    // Backbone.js 0.9.2 // (c) 2010-2012 Jeremy Ashkenas, DocumentCloud Inc. // Backbone may be freely ...

  9. lodash学习资料

    二.Lodash Lodash是一个具有一致接口.模块化.高性能等特性的 JavaScript 工具库.它内部封装了诸多对字符串.数组.对象等常见数据类型的处理函数,其中部分是目前 ECMAScrip ...

随机推荐

  1. pip批量安装和卸载package

    创建文件 将要安装或卸载的包按指定格式保存到文件中,这里以 packages.txt 为例,格式如下: Flask_Script==2.0.6 alembic==1.0.5 SQLAlchemy==1 ...

  2. golang 对struct进行Serialize的方法,即将存取二进制文件到struct的方法

    方法一: serialize 的标准方法: 使用gob 和 base64 或 base58. 方法二: 下面是自己实现的 serialize 方法,不推荐自己实现,应该用标准方法. 代码如下: pac ...

  3. SAP 创建 component

    1: 进入x3c 系统,输入 T-CODE     BSP_WD_CMPWB 2: 输入以Z开头的组件名. 点击create using wizard 3:  输入应用属性 4: 定义 bol mod ...

  4. 如何使用向量代表文档doc或者句子sentence

    1.“句向量”简介word2vec提供了高质量的词向量,并在一些任务中表现良好. 关于word2vec的原理可以参考这几篇论文: https://arxiv.org/pdf/1310.4546.pdf ...

  5. ROSETTA使用技巧随笔--score.sc处理

    对score.sc的便利操作: $ sort -n -k2 example_score_file.sc 此命令会以score文件的第二列进行排序(sort -n -k2,-n表示对数值型数据排序,可用 ...

  6. cocos2d JS 中的数组拼接与排序

    var arrA = [];//创建三个局部变量的新数组 var arrB = []; var arrC = []; var newCards = this.MyMahjong;//创建一个新的局部变 ...

  7. css属性 background

    background 在一个声明中设置所有的背景属性. background-attachment 设置背景图像是否固定或者随着页面的其余部分滚动. background-color 设置元素的背景颜 ...

  8. (转)MySql 获取所有级联父级或所有级联子级

    from:https://yq.aliyun.com/articles/48885 最近遇到了一个问题,在mysql中如何完成节点下的所有节点或节点上的所有父节点的查询?在Oracle中我们知道有一个 ...

  9. word论文文献引用上标括号

    参考 http://jingyan.baidu.com/article/c45ad29c310734051753e20d.html 在插入参考文献引用的尾注时,默认为上标数据且没有中括号.现在要统一加 ...

  10. <9>cc.Sprite组件

    1.精灵 精灵(Sprite)是Cocos系列的核心概念之一,是Cocos Creator最常用的显示图像的组件. 游戏中显示一个图片,我们就可以把这个叫做”精灵” sprite,这只是简单理解概念. ...