这三个都是函数自带的方法(Function.prototype),这三个方法都能够改变函数内部 this的指向,

call

//call方法接收三个参数,第一个是this指向,第二个,三个是传递给函数的实参,可以是数字,字符串,数组等类型的数据类型都可以
function fn(n1,n2){
console.log(this);
console.log(n1,n2)
}
fn.call();//=>this:window;
let obj = {fn:fn};
fn.call(obj);//=>this:obj;n1,n2:undefined
fn.call(1,2);//=>this: 1;n1=2,n2=undefined;
fn.call(obj,1,2);//=>this: obj;n1=1,n2=2; //Call方法的几个特殊属性
//非严格模式下
fn.call(undefined);//this=>window
fn.call(null);//this=>window
//严格模式下
"use strict"
fn.call(undefined);//this=>undefined
fn.call(null);//this=>null

apply

//apply方法的使用和call方法基本相同,唯一的区别是,apply方法传参要求是数组类型的,数组内可以任意形式的数据

function fn (n1,n2){
console.log(this);
console.log(n1,n2)
console.log(arguments)
}
let obj = {fn:fn};
fn.applay(abj,[1,2]);
fn.applay(abj,1,2);//报错

fn.applay(abj,[11,'apply',{a:123}]);//注意第二个参数必须是数组,否则会报错
 

bind

//bind和call方法调用形式类似,但是原理完全不同
fn.call(obj,10,20);//=>fn先执行,将fn内的this指向obj,并且把参数10,20传递给fn fn.bind(obj,10,20)//bind是先将fn中的this指向obj,并且将参数10,20预先传递给fn,但是此时的fn并没有被执行,只有fn执行时this指向和传递参数才有作用
fn.bind(obj,10,20);//=>不会有任何输出
fn.bind(obj,10,20)();//=>调用后才会有输出 //=>需求:点击box这个盒子的时候,需要执行fn,并且让fn中的this指向obj
oBox.onclick=fn; //=>点击的时候执行了fn,但此时fn中的this是oBox oBox.onclick=fn.call(opp); //=>绑定事件的时候就已经把fn立即执行了(call本身就是立即执行函数),然后把fn执行的返回值绑定给事件 oBox.onclick=fn.bind(opp);
//=>fn.bind(opp):fn调取Function.prototype上的bind方法,执行这个/*
* function(){
* fn.call(opp);
* }
*/
oBox.onclick=function(){
//=>this:oBox
fn.call(opp);
}

js中三个默认方法call,applay,bind的更多相关文章

  1. 一文带你认识Java8中接口的默认方法

    Java8是Oracle于2014年3月发布的一个重要版本,其API在现存的接口上引入了非常多的新方法. 例如,Java8的List接口新增了sort方法.在Java8之前,则每个实现了List接口的 ...

  2. Java 8——接口中个的默认方法和静态方法

    在Java SE 8之前,interface只是事物的抽象,用来定义统一的抽象事物和描述事物的抽象行为和属性. 但是在Java SE 8中,增加了可以在interface中增加默认实现的行为和事物的静 ...

  3. js中三种定义变量 const, var, let 的区别

    js中三种定义变量的方式const, var, let的区别 1.const定义的变量不可以修改,而且必须初始化. 1 const b = 2;//正确 2 // const b;//错误,必须初始化 ...

  4. node.js中的url.parse方法使用说明

    node.js中的url.parse方法使用说明:https://blog.csdn.net/swimming_in_it_/article/details/77439975 版权声明:本文为博主原创 ...

  5. js中三种弹出框

    javascript的三种对话框是通过调用window对象的三个方法alert(),confirm()和prompt()来获得,可以利用这些对话框来完成js的输入和输出,实现与用户能进行交互的js代码 ...

  6. js中function参数默认值

    --在dreamweaver做网站时,函数定义是在一个*.js文件中,其中定义了一个func,有四个参数,function func(string1,url,flag,icon),然后在另一个asp中 ...

  7. JS中定义类的方法

    JS中定义类的方式有很多种: 1.工厂方式    function Car(){     var ocar = new Object;     ocar.color = "blue" ...

  8. js 中读取JSON的方法探讨

    方法一:函数构造定义法返回 var strJSON = "{name:'json name'}";  //得到的JSONvar obj = new Function("r ...

  9. JS中定义类的方法<转>

    转载地址:http://blog.csdn.net/sdlfx/article/details/1842218 PS(个人理解): 1) 类通过prototype定义的成员(方法或属性),是每个类对象 ...

随机推荐

  1. 好记性不如烂笔头——WebService与Remoting

    一.WebService总体上分为5个层次: 1)HTTP传输信道 2)XML的数据格式 3)SOAP的封装协议,用于传输 4)WSDL的描述方式,用于引用 5)UDDI,通用描述.发现与集成服务,用 ...

  2. luogu2331 [SCOI2005]最大子矩阵

    题目大意 这里有一个n*m的矩阵,请你选出其中k个子矩阵,使得这个k个子矩阵分值之和最大.注意:选出的k个子矩阵不能相互重叠.1≤n≤100,1≤m≤2,1≤k≤10. 思路 #include < ...

  3. android recovery 系统代码分析 -- 选择进入【转】

    本文转载自:http://blog.csdn.net/andyhuabing/article/details/9226569 最近做Recovery的规范及操作指导文档,花了一些时间将流程搞清. An ...

  4. BNUOJ ->Borrow Classroom(LCA)

    B. Borrow Classroom Time Limit: 5000ms Memory Limit: 262144KB 每年的BNU校赛都会有两次赛前培训,为此就需要去借教室,由于SK同学忙于出题 ...

  5. RMAN异机恢复实验---转载

    一.RMAN异机恢复实验 2011年3月23日00:44 1.环境介绍: 主机1: 操作系统 REDHAT5.5 IP地址 172.16.1.120 主机名 sigle 数据库版本 10.2.0.4 ...

  6. E20170905-mk

    recursive   adj. 回归的,递归的;

  7. OneThink管理平台 ,登录后台一直提示验证码错误

    可能是数据库的错.上传到服务器以后要改2个地方的配置,\Application\Common\Conf\config.php(整站公用配置文 件),\Application\User\Conf\con ...

  8. angular js shopping

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

  9. PHP 数组基础知识

    php 数组基础知识function abc($a,$b,$c = 0){ echo $a,$b,$c;}abc(1,3); //调用方法 ////可变参数function def(){ $arr = ...

  10. 红黑联盟 php相关资讯

    http://www.2cto.com/tag/phpbanben.html