// 1.可以改变我们当前函数的this指向(当第一个参数为null、undefined时,默认指向window;)
// 2.还会让当前函数执行
//亲戚家
var otherHome = {
tips: '我家有电筒',
flashLight: function (meg) {
if (!meg) meg = '';
console.log(this.tips + meg)
}
}
//我的家
var myHome = {
tips: '我的家穷啊,',
}
// otherHome.flashLight();//我家里有电筒
// otherHome.flashLight.call(myHome, '借你家电筒用一下');//我的家穷啊,借你家电筒用一下
//理解为亲戚允许我使用他家的电筒了
//现在我的家可以说是这个样子的
var myHome = {
tips: '我的家穷啊,',
//注意:下面的代码不是真的在myHome里了,只是在执行
//otherHome.flashLight.call(myHome,'借你家电筒用一下')的时候类似于下面这种形式而已
//你可以打印一下myHome其实还是没变的,
//当然,手电筒怎么可能真给你,只是借你用一下而已
flashLight: function (meg) {
if (!meg) meg = '';
console.log(this.tips + meg)
}
}
//模拟call的源码进行分析
Function.prototype.Call = function (context) {//call传的第一个参数是要指向的this,
var context = context?context:window
context.fn = this;//这一步context.fn已经变为otherHome.flashLight,相当于otherHome.flashLight的方法借给了myHome
console.log(context.fn)
var args = [];
console.log(arguments[1]);
for (let i = 1; i < arguments.length; i++) {
args.push(arguments[i])
}
console.log(context.fn)
context.fn(...args);//["111"]
delete context.fn
}
//call与apply的区别
//功能上来说call与apply完全一样,差异性在于call接收的是一个参数列表,二apply接收的是一个数组(这里的差异性指第二个参数,第一个参数都是要指定的对象)
otherHome.flashLight.Call(myHome,['借你家电筒用一下']);
otherHome.flashLight.apply(myHome,['借你家电筒用一下']);
//bind()方法会创建一个新的函数,第一个参数作为this,第二个及以后的参数则作为函数的参数调用
const b = otherHome.flashLight.bind(myHome,['借你家电筒用一下']);
b();//输出我的家穷啊,借你家电筒用一下