apply、call、bind的区别?

一、call、apply、bind方法的共同点和区别:

(1)apply 、 call 、bind 三者都是用来改变函数的this对象的指向的;
(2)apply 、 call 、bind 三者第一个参数都是this要指向的对象,也就是想指定的上下文(函数的每次调用都会拥有一个特殊值——本次调用的上下文(context)——这就是this关键字的值。);
(3)apply 、 call 、bind 三者都可以利用后续参数传参;
(4)bind 是返回对应函数,便于稍后调用;apply 、call 则是立即调用 。

1、call():

语法:fn.call(thisArg,arg1,arg2.....)
其中thisArg就是fun函数运行时的指定的this值。arg1,arg2传递的其他值.....
其中thisArg有下面4种情况:
(1) 不传,或者传null,undefined, 函数中的this指向window对象
(2) 传递另一个函数的函数名,函数中的this指向这个函数的引用
(3) 传递字符串、数值或布尔类型等基础类型,函数中的this指向其对应的包装对象,如 String、Number、Boolean
(4) 传递一个对象,函数中的this指向这个对象

function a(){   
   console.log(this);   //输出函数a中的this对象
}       
function b(){}       
var c={name:"call"};    //定义对象c  

a.call();   //window
a.call(null);   //window
a.call(undefined);   //window
a.call(1);   //Number
a.call('');   //String
a.call(true);   //Boolean
a.call(b);   //function b(){}
a.call(c);   //Object

常用例子:
const obj= {
      name: ‘Lucy’
}

function fn(x,y){
   console.log(this);
   console.log(x+y)
}

//1、调用函数;2、改变this的指向
fn.call(obj,1,2)   //还可以传递参数
2、apply()

语法:fn.apply(thisArg,[arg1,arg2.....])
说明:如果 thisArg 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。
如果没有提供 任何一个参数,那么 Global 对象将被用作 thisArg, 并且无法被传递任何参数。

常用例子:
const obj= {
   name: ‘Lucy’
}

function fn(x,y){
   console.log(this);
   console.log(x+y)
}

//1、调用函数;2、改变this的指向
fn.call(obj,[1,2])   //还可以传递参数,必须以数组的形式出现

call 和 apply的区别
对于 apply、call 二者而言,作用完全一样,只是接受参数的方式不太一样。

3、bind()

语法:fn.bind(thisArg[, arg1[, arg2[, ... ]]]);

thisArg:当绑定函数被调用时,该函数会作为原函数运行时的this指向,当使用new操作符调用绑定函数时,该参数无效。
arg1, arg2... :当绑定函数被调用时,这些参数将置于实参之前传递给被绑定的方法。
返回值:返回由指定的this值和初始化参数改造的原函数拷贝。

var name = "The Window";
var object = {
   name : "My Object",
   getNameFunc : function() {
       return function(){
           return this.name;
       }.bind(this)
   }
}
console.log(object.getNameFunc()());//>My Object

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容