之前一直迷惑,记不住call(),apply(),bind()的区别。不知道如何使用,一直处于懵懂的状态。直到有一天面试被问到了这三个方法的区别,所以觉得很有必要总结一下。

如果有不全面的地方,后续再进行补充。

1. 改变this的指向

var obj = {
name : '张三',
age : 17,
myFun : function () {
console.log(this.name + ' ' + this.age);
}
}
var obj2 = {
name : '李四',
age : 20
}
obj.myFun() //张三 17
obj.myFun.apply(obj2) //李四 20
obj.myFun.call(obj2) //李四 20
obj.myFun.bind(obj2)() //李四 20

由例子可以看出,apply,call,bind都对this进行了重定向,apply和call使用方法相同。但是bind后面多了个(),因为bind返回的是一个全新的函数,但是三个返回结果一致。

2. 传参情况不同

var obj = {
name : '张三',
age : 17,
myFun : function (active,fm) {
console.log(this.name + ' ' + this.age + active + fm);
}
}
var obj2 = {
name : '李四',
age : 20
}
obj.myFun.apply(obj2,['爱学习','北京']); //李四 20爱学习北京
obj.myFun.call(obj2,'爱学习','北京'); //李四 20爱学习北京
obj.myFun.bind(obj2,'爱学习','北京')(); //李四 20爱学习北京
obj.myFun.call(obj2,['爱学习','北京'])();//李四 20爱学习,北京undefined

可以发现:apply参数传递用数组,并且在方法中会自动匹配参数

call参数传递是直接放进去,每个参数之间用逗号隔开

apply如果用和call类似的传递参数的方法,则在方法中会自动匹配参数。若像apply一样传递参数,则会把整个数组                       当作一个参数传递进去。

javascript中的call(),apply(),bind()方法的区别的更多相关文章

  1. JavaScript中call,apply,bind方法的区别

    call,apply,bind方法一般用来指定this的环境. var a = { user:"hahaha", fn:function(){ console.log(this.u ...

  2. 深入浅出:了解JavaScript中的call,apply,bind的差别

     在 javascript之 this 关键字详解文章中,谈及了如下内容,做一个简单的回顾:         1.this对象的涵义就是指向当前对象中的属性和方法.       2.this指向的可变 ...

  3. 浅析 JavaScript 中的 Function.prototype.bind() 方法

    Function.prototype.bind()方法 bind() 方法的主要作用就是将函数绑定至某个对象,bind() 方法会创建一个函数,函数体内this对象的值会被绑定到传入bind() 函数 ...

  4. 别真以为JavaScript中func.call/apply/bind是万能的!

    自从学会call/apply/bind这三个方法后我就各种场合各种使用各种得心应手至今还没踩过什么坑,怎么用?说直白点就是我自己的对象没有某个方法但别人有,我就可以通过call/apply/bind去 ...

  5. JavaScript 中的 Function.prototype.bind() 方法

    转载自:https://www.cnblogs.com/zztt/p/4122352.html Function.prototype.bind()方法 bind() 方法的主要作用就是将函数绑定至某个 ...

  6. Javascript中this作用域以及bind方法的重写

    这是一个最近遇到的笔试题,出于尊重,不会说出该公司的名字,源于自身比较少,笔试题是将bind方法用ES3重写,使用bind这个方法,导致一时半会懵了,只记得bind可以改变this的作用域. 作为查漏 ...

  7. Javascript中call,apply,bind方法的详解与总结

    在 javascript之 this 关键字详解 文章中,谈及了如下内容,做一个简单的回顾: 1.this对象的涵义就是指向当前对象中的属性和方法. 2.this指向的可变性.当在全局作用域时,thi ...

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

    一.探索call方法原理 Function.prototype.call = function(obj) { // 1.让fn中的this指向obj // eval(this.toString().r ...

  9. JavaScript内置一些方法的实现原理--new关键字,call/apply/bind方法--前戏

    new关键字,call/apply/bind方法都和this的绑定有关,在学习之前,首先要理解this. 一起来学习一下this吧 首先.this是一个对象. 对象很好理解,引用类型值,可以实现如th ...

随机推荐

  1. Linux中定时删除超过指定大小的文件夹

    背景: 开发环境总是动不动就没有空间了, 大部分都是debug日志.所以有必要在日志很疯狂的时候,删除不必要的日志. 思路:一. 书写删除日志文件脚本: 定时任务执行.  但是有时候的日志是需要保存用 ...

  2. linux-2.6内核驱动学习——jz2440之按键

      //以下是学习完韦东山老师视屏教程后所做学习记录中断方式取得按键值: #include <linux/module.h> #include <linux/kernel.h> ...

  3. MFC 消息映射、分派和传递

    几个重要的结构体: struct AFX_MSGMAP { AFX_MSGMAP* pBaseMessageMap; AFX_MSGMAP_ENTRY* lpEntries; } struct AFX ...

  4. 17-[模块]-time&datetime

    1.表示时间time方式 在Python中,用三种方式来表示时间,分别是时间戳.格式化时间字符串和结构化时间 1.时间戳(timestamp):也就是1970年1月1日之后的秒, 例如15063882 ...

  5. SpringBoot日记——日志框架篇

    在项目的开发中,日志是必不可少的一个记录事件的组件,所以也会相应的在项目中实现和构建我们所需要的日志框架. 而市面上常见的日志框架有很多,比如:JCL.SLF4J.Jboss-logging.jUL. ...

  6. wordpress4.4+版本自动生成一个768w像素缩略图的解决办法

    4.4版本以后,wordpress增加了响应式图片的功能,目的是让图片能适应手机.平板等不同屏幕,但是我不想要这个功能,把缩略图大小全调成0,function.php里的相关函数全删除了, 上传图片还 ...

  7. iOS逆向+越狱

    感觉本文涉及内容有点多的,但是自己不愿意写太多,就简单的谢谢关于ios上手的东西吧 初级入手不免要用到,pp助手,i4 tools等 iOS逆向-ipa包重签名及非越狱手机安装多个应用 1.常识 我们 ...

  8. Caffe Blob针对图像数据在内存中的组织方式

    Caffe使用Blob结构在CNN网络中存储.传递数据.对于批量2D图像数据,Blob的维度为 图像数量N × 通道数C × 图像高度H × 图像宽度W 显然,在此种场景下,Blob使用4维坐标定位数 ...

  9. Python中的常规习题

    循环总结 while 语句 for 语句 - 字符串 - range() 函数 break 语句 continue 语句 学习笔记传送门 列表学习 # 练习: # 输入一个整数n, 判断这个整数是否是 ...

  10. 经典的性能优化最佳实践 web性能权威指南 读书笔记

    web性能权威指南 page 203 经典的性能优化最佳实践 无论什么网络,也不管所用网络协议是什么版本,所有应用都应该致力于消除或减 少不必要的网络延迟,将需要传输的数据压缩至最少.这两条标准是经典 ...