为了加深对基础知识的理解,今天再复习下js中的apply,call,bind的区别和用法。整理笔记的过程也是一个再次学习的过程。

apply和call

js中的调用apply和call方法可以改变某个函数执行的上下文环境,也就是可以改变函数内this的指向值。

例子:

var person={
name:'aa',
getName:function(){
console.log(this.name);
}
}
var person2 = {
name:'bb'
} person.getName();
person.getName.call(person2);
person.getName.apply(person2);

person2中没有getName()方法,但是person2想执行getName()方法,就可以使用apply或call方法来借用person中的getName()方法。

当一个对象A没有某个方法时,其他对象B有该方法,就可以使用call或apply来借用对象B中的这个方法。这个时候就动态的改变了this的值。

apply,call二者区别

二者作用相同,区别是传入参数的方法不同。

例子:

var person={
name:'aa',
getName:function(){
console.log(this.name);
},
getPerson:function(age,sex){
this.age = age;
this.sex = sex;
console.log(this)
}
}
var person2 = {
name:'bb'
} person.getName();
person.getName.call(person2);
person.getName.apply(person2); person.getPerson.call(person2,'1','男');
person.getPerson.apply(person2,['2','女']);

call()和apply()方法的参数中,第一个参数是指定的上下文环境或者指定的对象,call()方法中后面的所有参数都是用逗号表示,apply()方法中所有参数都是用数组表示。如果参数数量确定,可以使用call方法,如果数量不确定,则使用apply方法。

bind()方法

bind() 方法与 apply 和 call 很相似,也是可以改变函数体内 this 的指向。

MDN的解释是:bind()方法会创建一个新函数,称为绑定函数,当调用这个绑定函数时,绑定函数会以创建它时传入 bind()方法的第一个参数作为 this,传入 bind() 方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数。

语法:

var bound = fun.bind(this,arg1,arg2...);

如果只是想改变上下文环境,而非执行该函数,则使用bind方法。apply/call会马上执行该函数。

总结:

apply,call,bind都是改变函数的this指向的,改变函数执行的上下文环境。

apply,call,bind第一个参数指this需要指向的对象,也就是函数运行时所处的对象环境。

bind返回新的函数,但是不执行,apply/call会立即执行该函数。

参考:

http://www.cnblogs.com/coco1s/p/4833199.html

JS之apply,call,bind区别的更多相关文章

  1. call和apply和bind区别

    call和apply特征一样 都是用来调用函数 立即调用 但是可以在调用函数的同时 通过第一个参数指定函数内部this的指向 call 调用的时候 参数必须以参数列表的形式进行传递 也就是以逗号分隔的 ...

  2. apply,call,bind区别

    js中有三个改变this指针的方法,分别是 apply,call,bind.很多人只知道能改变的this,但是具体的适用场景不是太清楚.我也是遇到坑后不断的实践发现了区别. call ,apply方法 ...

  3. javascript中apply,call,bind区别,bind兼容等问题总结

    1 三者的相似之处: (1).都是用来改变函数的this对象的指向的 (2).都是用第一个参数来做this对象的指向 (3).都可以传参数进去 那么,具体到它们有什么区别呢?请看下面的例子: 两个对象 ...

  4. call(),apply(),bind()区别?

    每个函数都包含两个非继承而来的方法,apply()和call(),这两方法的用途都是在特定的作用域中调用函数,实际上等于设置函数数体内的this对象的值. apply()和call()第一个参数都一样 ...

  5. call、apply、bind 区别

    1.为什么要用 call .apply? 为了 改变方法里面的属性而不去改变原来的方法 function fruits() {} fruits.prototype = { color: "r ...

  6. JS中用apply、bind实现为函数或者类传入动态个数的参数

    为纪念10年没写blog,第一篇博文就以这样一个有趣的窍门开始吧 -___- 在ES5中,当我们调用一个函数时,如果要传入的参数是根据其他函数或条件判断生成的,也就是说不确定会传入多少个参数时,在不改 ...

  7. js中call、apply和bind的区别

    在JS中,这三者都是用来改变函数的this对象的指向的,他们有什么样的区别呢.在说区别之前还是先总结一下三者的相似之处:1.都是用来改变函数的this对象的指向的.2.第一个参数都是this要指向的对 ...

  8. js中的call,apply,bind区别

    在JavaScript中,call.apply和bind是Function对象自带的三个方法,这三个方法的主要作用是改变函数中的this指向. call.apply.bind方法的共同点和区别:app ...

  9. js中call、apply和bind到底有什么区别?

    介绍 在js中,每个函数的原型都指向Function.prototype对象(js基于原型链的继承).因此,每个函数都会有apply,call,和bind方法,这些方法继承于Function. 它们的 ...

随机推荐

  1. .NET下的并行开发

    并行开发一直是程序员在开发项目中遇到的一道坎,但为了迎合硬件的升级,面对高端多核的处理器,并行编程势在必行.在.NET平台下的开发支持并行模式,下面用一个实际项目说明并行的高效率和神奇之处. 在优化中 ...

  2. iOS开发笔记13:顶部标签式导航栏及下拉分类菜单

    当内容及分类较多时,往往采用顶部标签式导航栏,例如网易新闻客户端的顶部分类导航,最近刚好有这样的应用场景,参考网络上一些demo,实现了这种导航效果,记录一些要点. 效果图(由于视频转GIF掉帧,滑动 ...

  3. UI交互设计的网站

    1.http://www.xueui.cn/other-tutorials/ui-interaction-design.html 2.http://www.3lian.com/edu/2015/12- ...

  4. javascript对象模型和function对象

    javascript中,函数就是对象 <html> <head> <script type="text/javascript"> functio ...

  5. JQuery判断radio是否选中,获取选中值

    本文摘自:http://www.cnblogs.com/xcj1989/archive/2011/06/29/JQUERY_RADIO.html   /*----------------------- ...

  6. mysql中FIND_IN_SET的使用方法

    在mysql中,有时我们在做数据库查询时,需要得到某字段中包含某个值的记录,但是它也不是用like能解决的,使用like可能查到我们不想要的记录,它比like更精准,这时候mysql的FIND_IN_ ...

  7. PL/SQL之--变量

    一.PL/SQL 简介 PL/SQL也是一种程序语言,叫做过程化SQL语言(Procedural Language/SQL).PL/SQL是oracle对sql语句的一种扩展,在普通SQL语句的使用上 ...

  8. Apache2.4和Apache2.2访问控制配置语法对比

    一.访问控制 在Apache2.2版本中,访问控制是基于客户端的主机名.IP地址以及客户端请求中的其他特征,使用Order(排序), Allow(允许), Deny(拒绝),Satisfy(满足)指令 ...

  9. 计算几何--求凸包模板--Graham算法--poj 1113

    Wall Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 28157   Accepted: 9401 Description ...

  10. .net framework 4.6.2 下载

    .net framework   .net framework版本: 4.6.2 File Name: NDP462-KB3151800-x86-x64-AllOS-ENU.exe 发布日期: 201 ...