fn.call(obj,arg1,arg2,arg3)
fn.apply(obj,[arg1,arg2,arg3])
fn.bind(obj,20,'中国‘)()
call、apply、bind可以将某个函数的this指向修改为传?这三个?法中的第?个参数，其中call、apply会?即执?，bind返回的是?个函数，需调?后执?。
第?个参数是传?要执?的?法中的参数，call、bind是独?传递参数，apply是以数组传递参数的
//apply
function sum(sum1, sum2) {
return sum1 + sum2
}
function sumApply1(sum1, sum2) {
return sum.apply(this, arguments) // 传如arguments对象
return sum.apply(this, [sum1, sum2]) // 传入数组
}
console.log(sumApply1(10,20)) // => 30
//call
function sum(sum1, sum2) {
return sum1 + sum2
}
function sumCall1(sum1, sum2) {
return sum.call(this, sum1, sum2)
}
console.log(sumCall1(10,20)); // => 30
var color = 'red';
var o = {
color: 'blue'
}
function sayColor() {
console.log(this.color);
}
sayColor.call(this) // => red
sayColor.call(window) // => red
sayColor.call(o); // => blue
//bind
window.color = 'red'
var o = {
color: 'blue'
}
function sayColor() {
console.log(this.color)
}
var bindSayColor = sayColor.bind(o);
bindSayColor() // => blue
使?场景：
1、需要改变某个函数的this指向时
2、当参数较少时可以使?call，参数较多可以使?apply以数组的?式传递
3、当需要重复调?时，可以使?bind新定义?个?法
手写call apply bind：
call和apply实现思路主要是：
1、判断是否是函数调用，若非函数调用抛异常
2、通过新对象（context）来调用函数
3、给context创建一个fn设置为需要调用的函数
4、结束调用完之后删除fn
Function.prototype.myCall = function (context) {
// 先判断调用myCall是不是一个函数
// 这里的this就是调用myCall的
if (typeof this !== 'function') {
throw new TypeError("Not a Function")
}
// 不传参数默认为window
context = context || window
// 保存this
context.fn = this
// 保存参数
let args = Array.from(arguments).slice(1) //Array.from 把伪数组对象转为数组
// 调用函数
let result = context.fn(...args)
delete context.fn
return result
}
Function.prototype.myApply = function (context) {
// 判断this是不是函数
if (typeof this !== "function") {
throw new TypeError("Not a Function")
}
let result
// 默认是window
context = context || window
// 保存this
context.fn = this
// 是否传参
if (arguments[1]) {
result = context.fn(...arguments[1])
} else {
result = context.fn()
}
delete context.fn
return result
}
bind实现思路：
1、判断是否是函数调用，若非函数调用抛异常
2、返回函数
3、判断函数的调用方式，是否是被new出来的
4、new出来的话返回空对象，但是实例的__proto__指向_this的prototype
5、完成函数柯里化Array.prototype.slice.call()
Function.prototype.myBind = function(context){
// 判断是否是一个函数
if(typeof this !== "function") {
throw new TypeError("Not a Function")
}
// 保存调用bind的函数
const _this = this
// 保存参数
const args = Array.prototype.slice.call(arguments,1)
// 返回一个函数
return function F () {
// 判断是不是new出来的
if(this instanceof F) {
// 如果是new出来的
// 返回一个空对象，且使创建出来的实例的__proto__指向_this的prototype，且完成函数柯里化
return new _this(...args,...arguments)
}else{
// 如果不是new出来的改变this指向，且完成函数柯里化
return _this.apply(context,args.concat(...arguments))
}
}
}
