都是天生自带的内置方法(Function.prototype),所有的函数都可以调取这三个方法,改变this指向

call 语法:fn.call(context,para1......) 把fn方法执行。并且让fn方法中的this变为context,而para1....都是给fn传递的实参(第一个参数永远是this,后面的参数是实参)

非严格模式 call方法的几个特殊性:

fn.call() =>this:window

fn.call(null) =>this:window

fn.call(undefined) =>this:window

严格模式

"use strict "

fn.call() =>this:undefined

fn.call(null) =>this:null

fn.call(undefined) =>this:undefined

(第一个参数传谁就是谁,不传就是undefined)

apply

apply的语法和call基本一致,作用原理也基本一致,唯一的区别:apply把传递给函数的实参以数组形式存放(但是也相当于在给函数一个个的传递实参值)

fn.call(null,10,20,30);

fn.apply(null,[10,20,30]); =>传递给fn的时候也是一个个的传递进去的

bind 也是改变this的方法,它在IE6,7,8下不兼容,它和call(以及apply)改变this的原理不一样 fn.call(opp,10,20) =>把fn执行,让fn中的this变为opp,并且把10&&20分别传递给fn fn.bind(opp,10,20) =>预先让fn中的this指向opp,并且把10和20预先传递给fn,此时的fn没有被执行(只有当执行的时候this和实参才会起到应有的作用)

需求:点击box这个盒子的时候,需要执行fn,并且让fn中的this指向opp

oBox.onclick=fn; //=>点击的时候执行了fn,但是fn中的this是oBox

oBox.onclick=fn.call(opp); //=>绑定事件的时候已经把fn立即执行了(call本身就是立即执行函数),然后把fn执行的返回值绑定给事件

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

  1. call apply bind 的区别

    1.call和apply都是对函数的直接调用,而bind方法返回的仍然是一个函数,因此后面还需要()来进行调用才可以 var xw={ name: "小王", gender: &q ...

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

    call.apply.bind方法的共同点与区别: apply.call.bind 三者都是用来改变函数的this对象的指向: apply.call.bind 三者都可以利用后续参数传参: bind ...

  3. call、apply/bind的区别和用法(简单粗暴的解释)

    var obj1={ name:"bob", age:20 } var obj2={ name:"coco", age:22 } function getAge ...

  4. JS中call,apply,bind的区别

    1.关于this对象的指向,请看如下代码 var name = 'jack'; var age = 18; var obj = { name:'mary', objAge:this.age, myFu ...

  5. 浅谈call apply bind的区别

    这三个方法的用法非常相似,将函数绑定到上下文中,即用来改变函数中this的指向.举个例子: var zlw = { name: "zlw", sayHello: function ...

  6. javascript中的call(),apply(),bind()方法的区别

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

  7. 有关call和apply、bind的区别及this指向问题

    call和apply都是解决this指向问题的方法,唯一的区别是apply传入的参数除了其指定的this对象之外的参数是一个数组,数组中的值会作为参数按照顺序传入到this指定的对象中. bind是解 ...

  8. this指向与call,apply,bind

    this指向与call,apply,bind ❝ 「this」问题对于每个前端同学来说相信都不陌生,在平时开发中也经常能碰到,有时候因为「this」还踩过不少坑,并且「this」问题在面试题中出现的概 ...

  9. javascript中apply、call和bind的区别

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

随机推荐

  1. Haproxy官方文档翻译(第二章)配置Haproxy 附英文原文

    2.配置 HAProxy 2.1 配置文件格式 Haproxy的配置过程包含了3部分的参数资源:- 命令行中的参数,此种参数总是享有优先权被使用- 配置文件中global节点中的参数,此种参数是进程范 ...

  2. Parallels Desktop 14.1.3中文版win系统安装教程

    parallels desktop 14 中文版(pd虚拟机)是mac上最强大也是最好用的虚拟机软件,本站第一时间为大家带来这款parallels desktop 14 破解版,最新版本的parall ...

  3. CH 5102Mobile Service题解

    题目: 用动态规划很容易将完成任务量作为dp的阶段,通过指派服务员,从当前i-1个任务转移到i个任务: 我们可以用一个四维数组f[i][x][y][z]来表示在完成当前任务i时,三个机器人分别在x,y ...

  4. VS2010下安装boost库

    在我们的C++项目中安装boost库,下面以VS2010版本作为例子,其它版本的设置也差不多. 一.编译生成boost库 1.下载最新的boost(本人下载的是boost_1_56_0).boost官 ...

  5. The application to execute does not exist: 'C:\Users\Administrator\.dotnet\tools\.store\dotnet-aspnet-codegenerator\2.2.0-rtm-35687\dotnet-aspnet-codegenerator\2.2.0-rtm-35687\tools\netcoreapp2.1\any\

    vs code mvc搭建基架执行命令操作出现的问题解决方式重新复制拷贝一份2.2.0命名为2.2.0-rtm-35687, 修改

  6. mybatis-ehcache整合中出现的异常 ibatis处理器异常(executor.ExecutorException)解决方法

    今天学习mabatis时出现了,ibatis处理器处理器异常,显示原因是Executor was closed.则很有可能是ibatis的session被关闭了, 后面看了一下测试程序其实是把sqlS ...

  7. .net 去除特殊字符

    str = Regex.Replace(str, @"<script[^>]*?>.*?</script>", "", Regex ...

  8. 原生js点击按钮切换图片

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  9. vue页面引入外部js文件遇到的问题

    问题一:vue文件中引入外部js文件的方法 //在vue文件中 <script> import * as funApi from '../../../publicJavaScript/pu ...

  10. java枚举通俗实例解析

    1         枚举 1.1            枚举的作用 我们经常要定义一些常量值,例如日期(MONDAY,TUESDAY……)或者错误码等.可以将常量组织起来,统一进行管理.常量比较只是值 ...