bind,call.apply 的区别?

bind,call.apply 的区别?

一、作用

callapplybind 作用是改变函数执行时的上下文,简而言之,就是函数运行时的this指向。

什么情况下需要改变this指向,举例:

var name = "zhangsan";
var obj = {
	name:"lisi",
	say:function(){
		console.log(this.name)
	}
};

obj.say();  // lisi this指向obj对象
setTimeout(obj.say(),0); // zhangsan,this指向window对象

从上面可以看出,正常情况下say方法输出 lisi

但是我们把say放在了setTimeout方法中,在定时器中是做为回调
函数来执行的,因此回到主栈执行时是在全局执行上下文的环境中执行的,这时候this指向window所以say方法输出zhangsan

我们实际需要的是this指向obj这时候就需要改变this的指向了

setTimeout(obj.say.bind(obj),0) // lisi this指向obj对象

二、区别

applybindcall的使用

apply:

接收两个参数,第一个参数是this的指向,第二个参数是函数接收的参数,以数组的形式传入

改变this指向后原函数回立即执行,且此方法只是临时改变this指向一次

function fn(...args){
	console.log(this,args)
};
let obj = {
	myName:"zhangsan"
};
fn.apply(obj,[1,2]); // this指向obj,传入的参数是一个数组
fn(1,2); // this指向window

当第一个参数是 null 或者是undefined的时候,this默认指向window.

fn.apply(null,[1,2]) // this指向window
fn.apply(undefined,[1,2]) // this指向window	

call:

接收两个参数,第一个参数是this指向,后面一个是一个参数列表,和apply一样,改变this指向后函数会立即执行,且此方法只是临时改变this指向一次。

function fn(...args){
	console.log(this,args)
};
let obj = {
	myName:"zhangsan"
};
fn.call(obj,1,2); // this指向obj,传入的参数是一个列表
fn(1,2); // this指向window

同样第一个参数是 null 或者是undefined的时候,this默认指向window.

fn.call(null,1,2) // this指向window
fn.call(undefined,1,2) // this指向window	

bind:
bind方法和call方法很相似,第一个参数也是this的指向,后面传入的也是一个参数列表(但是这个参数列表可以分多次传入)

改变this指向后不会立即执行,而是返回一个永久改变this指向的函数

function fn(...args){
	console.log(this,args)
};
let obj = {
	myName:"zhangsan"
};
const bindFn = fn.bind(obj); // this指向传入的obj ,bindFn不会立即执行,需要手动执行

bindFn(1,2) // this指向obj
fn(1,2); // this指向window

三、总结

applycallbind、三者的区别在于:

  • 三者都可以改变this的指向
  • 三者第一个参数都是this的指向,如果没有这个参数或者这个参数是null或者是undefined则this默认指向全局的window
  • 三者都可以传参,但是apply是数组,call是参数列表,且applycall是一次传入,bind是分多次传入。
  • bind是返回绑定this之后的函数,callapply是立即执行
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

️不倒翁

你的鼓励就是我前进的动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值