call、apply、bind方法实现

call()、apply()、bind() 这三个方法都可以显示的指定调用函数的this指向

• call： 接收的第一个参数是this绑定的对象，其余参数将作为函数执行时传入的参数
• apply： 接收的第一个参数时this绑定的对象，第二个参数时一个参数数组
• bind: 通过传入一个对象，返回一个this绑定了传入对象的新函数。这个函数的this指向除了使用new时会改变，其他情况下不会发生改变

一、call 方法实现

1. 判断调用对象是否是函数，因为即使是定义在函数（Function）原型上的方法，也可能会出现使用call等方式调用的情况
2. 判断传入的上下文对象是否存在，如果不存在，则将上下文对象设置为window
3. 处理传入的参数，截取除第一个参数外的所有参数
4. 将函数作为上下文对象的一个属性
5. 使用上下文对象调用这个方法，保存返回结果
6. 删除刚才在上下文对象中新增的属性
7. 返回结果

Function.prototype.customCall = function(context) {
	// 判断调用对象是否是函数
	if(typeof this !== 'function') {
		console.error('type error!!!');
	}
	let args = [...arguments].slice(1);
	let res = null;
	context = context || window;
	// 将调用函数设置为上下文对象的属性
	context.fn = this;
	// 调用函数
	res = context.fn(...args);
	// 从上下文对象中删除这个属性
	delete context.fn;
	return res;
}

二、apply 实现

1. 判断调用的对象是否是函数
2. 判断传入的上下文对象是否存在，如果不存在，则设置为window
3. 将函数作为上下文对象的一个属性
4. 判断参数值是否传入
5. 使用上下文对象来调用这个方法，并保存返回结果
6. 删除刚才的新属性
7. 返回结果

Function.prototype.customApply = function(context) {
	if(typeof this !== 'function') {
		console.error('type error');
	}
	let res = null;
	context = context || window;
	context.fn = this; // 将函数设置为对象方法
	if(arguments[1]) {
		res = context.fn(...arumgments[1]);
	} else {
	 	res = context.fn();
	}
	delete context.fn;
	return res;
}

三、bind 实现

1. 判断调用对象是否是函数
2. 保存当前函数的引用，获取其余传入参数值
3. 创建一个函数返回
4. 函数内部使用apply来绑定函数调用，需要判断函数作为构造函数的情况，这个时候需要传入当前函数的this给apply调用，其余情况都传入指定的上下文对象

Function.prototype.customBind = function(context) {
	if(typeof this !== 'function') {
		console.error('type error');
	}
	// 获取参数
	let args = [...arguments].slice(1);
	let fn = this;
	return function Fn() {
		// 根据调用方式传入不同的值
		return fn.apply(
			this instanceof Fn ? this : context,
			args.concat(...arguments)
		);
	};
}