call()、bind()、apply() 三者的作用、用法和区别

call()、bind()、apply() 三者的作用、用法和区别

作用

call()、bind()、apply()的作用都是改变this指向的方法

区别

• call()和apply()会调用函数、并且改变函数内部的指向。

• call()和apply()传递的参数不一样，call()要求参数arg1,arg2…形式，apply()必须是数组

• bind()不会调用函数，可以改变函数内部指向。

• call()方法

• 使用：fun.call(thisArg,arg1,arg3,…)
  //thisArg为想要指向的对象，arg1,arg3为参数
  // 调用会立即执行

function Person(uname,age){
	this.uname = uname
	this.age = age
}
function Son(uname,age){
	Person.call(this,uname,age)
}
var son = new Son("zhang",12)
console.log(son)

• apply()方法
• 使用：fun.apply(thisArg,[argsArray])
  // thisArg：在fun函数允许时指定的this值
  // argArray： 必须包含在数组里
  // 调用会立即执行

let obj = {
	name:'xiaoming",
	age:24,
	sayHello: function(job,hobby){
	 console.log(`我叫${this.name}，今年${this.age}岁。我的工作是：${job}，我的爱好是: ${hobby}。`)
	 //我叫xiaoming,今年24岁。我的工作是: 程序员，我的爱好是: 看美女。

	}
}
obj.sayHello("程序员","看美女")
let obj1 = {
	name:'lihua',
	age:30
}
obj.sayHello.apply(obj1,["设计师",'画画'])
// 我叫lihua,今年30岁。我的工作是: 设计师，我的爱好是: 画画。

• bind()方法
• 使用：fun.bind(thisArg,arg1,arg2,arg3,…)
  // 不会立即执行
  // 会返回一个修改了this指向后的fn，需要调用才会执行

let obj = {
	name:'xiaohong',
	age:24,
	sayHello:function(obj,hobby){
		 console.log(`我叫${this.name},今年${this.age}岁。我的工作是: ${job}，我的爱好是: ${hobby}。`);
	obj.sayHello('程序员', '看美女'); 
	// 我叫xiaohong,今年24岁。我的工作是: 程序员，我的爱好是: 看美女。
	}
}
let obj1 = {
 	name:'linhu',
 	age:30
}
obj.sayHello.bind(obj1,"设计师","画画"); 
//无输出结果
var fn = obj.sayHello.bind(obj1,"设计师","画画"); 
fn()
// 我叫lihua,今年30岁。我的工作是: 设计师，我的爱好是: 画画