call方法:

语法:call(thisObj,'',''........)

定义:调用一个对象的一个方法,以另一个对象替换当前对象

说明:call方法可以用来代替另一个对象调用一个方法。call方法可将一个函数的对象上下文初始的上下文改变为由thisObj指定的新对象,如果没有提供thisObj参数,那么global对象被用做thisObj

apply方法:

语法:apply(thisObj,['','',''....])

定义:应用某一个对象的方法,用另一个对象替换当前对象

如果argArray不是一个有效的数组或者不是arguments对象,那么将导致一个TypeError.如果没有提供argArray和thisObj任何一个参数,那么Global对象将用做thisObj,并且无法被传递任何参数

相同之处:

1、都是用来改变函数的this对象的指向
2、第一个参数都是this要指向的对象
3、都可以利用后续参数传参 不同之处:
1、call和apply都是对函数的直接调用,而bind方法返回的仍然是一个函数,因此后面需要加上()来进行调用才可以

案例一:bind与call、apply的区别

var a={
name:'阿姨请别把您闺女介绍给我',
sex:'男',
age:'24',
say:function(){
console.log(this.name+',今年'+this.age+'岁,性别'+this.sex)
}
} var b={
name:'就要把闺女介绍给你',
sex:'女',
age:'18'
}
a.say();//阿姨请别把您闺女介绍给我,今年24岁了,性别男 那么我们想一下如何让b用say的方法显示数据呢? 用call方法:a.say.call(b) 用apply方法:a.say.apply(b) 用bind方法:a.say.bind(b)()

案例二:call与apply的区别

var a={
name:'阿姨请不要把您闺女介绍给我',
sex:'男',
age:'18',
say:function(school,grade){
console.log(this.name+'性别'+this.sex+'年龄'+this.age+school+grade)
}
} var b={
name:'就喜欢把闺女介绍给你',
sex:'女',
age:'18'
} 现在我们看say方法中多了两个参数,我们通过call和apply的参数进行传参 用call方法:a.say.call(b,'清华','三年级') 用apply方法:a.say.apply(b,['清华','六年级']) call后面的参数与say方法中是一一对应的,而apply第二个参数是一个数组 用bind方法:a.say.bind(b,'清华','三年级')
但是由于bind返回的仍然是一个函数,所以我们可以在调用的时候在进行传参
a.say.bind(b)('清华','三年级')
由于IE6-IE8不支持该方法,所以若想在不同浏览器中使用所以我们要做下处理
兼容处理bind方式
if(!Function.prototype.bind){
Function.prototype.bind=function(obj){
var This=this;
var args=arguments;
return function(){
This.apply(obj,Array.prototype.slice.call(args,1))
}
}
}

call Apply bind详解的更多相关文章

  1. 011-Scala中的apply实战详解

    011-Scala中的apply实战详解 object中的apply方法 class中的apply方法 使用方法 apply方法可以应用在类或者Object对象中 class类 必须要创建实例化的类对 ...

  2. Js apply 方法 详解

    Js apply方法详解 我在一开始看到JavaScript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这 ...

  3. Js apply()使用详解

    Js apply方法详解 我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这 ...

  4. angularJS中$apply()方法详解

    这篇文章主要介绍了angularJS中$apply()方法详解,需要的朋友可以参考下   对于一个在前端属于纯新手的我来说,Javascript都还是一知半解,要想直接上手angular JS,遇到的 ...

  5. Js apply方法详解,及其apply()方法的妙用

    Js apply方法详解 我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这 ...

  6. 原生JS:Function对象(apply、call、bind)详解

    Function对象(apply.call.bind) 原创文章,转摘请注明出处:苏福:http://www.cnblogs.com/susufufu/p/5850180.html 本文参考MDN做的 ...

  7. javascript中的apply,call,bind详解

    apply.call 在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部 this 的指向. Jav ...

  8. call,apply和bind详解

    一.call和apply call和apply其实是同一个东西,区别只有参数不同,call是apply的语法糖,所以就放在一起说了,这两个方法都是定义在函数对象的原型上的(Function.proto ...

  9. call,apply,bind详解

    为什么要改变this指向? 我们知道bind,call,apply的作用都是用来改变this指向的,那为什么要改变this指向呢?请看下面的例子: var name="lucy"; ...

随机推荐

  1. C语言实验一(1)

    #include<stdio.h>int main(){ int a,b,sum; a=123; b=456; sum=a+b; printf("sum is %d\n" ...

  2. 5种网络IO模型

    5种网络IO模型(有图,很清楚)   同步(synchronous) IO和异步(asynchronous) IO,阻塞(blocking) IO和非阻塞(non-blocking)IO分别是什么,到 ...

  3. pytorch使用总结

    loss的获取 在看别人代码的时候发现都是 loss=net.loss train_loss+=loss.data[0]#train_loss用于累加梯度 在想为什么不直接使用loss呢,因为pyto ...

  4. OO第二单元多线程电梯总结分析

    一.概述 这一部分的作业考察的关注点与上一次的作业有所不同,上一次的考察重点主要集中在输入输出的判定以及多态的考察上面,而这一次是让我们进行多线程程序的调度与开发.这次开发过程中最大的感受就是自己之前 ...

  5. 2019.3.16数据结构考试(Problem 1. rotinv)(循环逆序对)

    Problem 1. rotinvInput file: rotinv.inOutput file: rotinv.outTime limit: 2 secondsMemory limit: 256 ...

  6. Linux 下各文件夹的含义

    /bin 该目录中存放Linux的常用命令./boot 该目录默认下存放的是Linux的启动文件和内核./cdrom 该目录在刚安装系统时是空的,你可以将光驱文件系统挂在这个目录下./dev 该目录包 ...

  7. Angular7.1.4+Typescript3.1框架学习(一)

    起因:学习ionic4之前先学习下angular+ts 以win10为开发平台:当前最新版本为angular7;根据官网资料做如下总结: 1. angular安装 前提:Node.js 的 8.x 或 ...

  8. angular 组件学习-组件内属性绑定

    #组件内的属性(元素的属性)绑定(property binding) 应用场景:通过改变DOM元素的属性,动态显示/隐藏一个元素 知识点:HTML 属性与DOM属性的区别 改变HTMl属性,浏览器需要 ...

  9. oracle存储过程出现ORA-01403: 未找到数据 问题解决方法

    这段时间在做一个业务,需要用到存储过程处理业务逻辑,但是出现一个ORA-01403: 未找到数据 问题, 那么这个应该如何解决这个问题 declare mixType integer; begin - ...

  10. 一、linux概述

    1. 学习Linux之前先了解Unix Unix是一个强大的多用户.多任务操作系统.于1969年在AT&T的贝尔实验室开发.UNIX的商标权由国际开放标准组织(The Open Group) ...