这三个方法基本不常用,心血来潮记录一下
1.修改this的区别
- call、apply、bind都可以修改this指向
- call、apply修改this指向时会自动调用该方法
- bind会返回一个新的方法,需要调用新方法才会执行
修改this及调用demo
const one = {
name: 'one',
execNameFn(a, b) {
console.log(this.name, a, b);
}
}
const two = {
name: 'two'
}
// 修改 execNameFn调用时this的指向
one.execNameFn.call(two)
// 打印结果 two undefined undefined
one.execNameFn.apply(two)
// 打印结果 two undefined undefined
// 不会立即执行
const newFn = one.execNameFn.bind(two)
// 打印结果 undefined
newFn()
// 打印结果 two undefined undefined
2.传参的区别
- call传递参数时直接写在第一个参数后面(第一个参数是当前指向的对象),用逗号隔开
- apply传递参数是以数组格式写在第一个参数后面(第一个参数是当前指向的对象)
- (注意)bind传递参数可以在还没创建出新函数时传递,也可以在新函数传递参数,在指向当前实例后面传递的参数优先级高,后面新创建的函数参数不能覆盖,详情看demo
const one = {
name: 'one',
execNameFn(a, b) {
console.log(this.name, a, b);
}
}
const two = {
name: 'two'
}
one.execNameFn.call(two,1,2)
// 返回值 two 1 2
// 使用数组传参
one.execNameFn.apply(two,[1,2])
// 返回值 two 1 2
// * 两种方式,第二种不能覆盖第一种
// 第一种
const newFn = one.execNameFn.bind(two,1,2)
// 执行
newFn()
// 返回值 two 1 2
// 第二种
newFn(2,3)
// 返回值 two 1 2
// 通过返回的函数传递 入参
const newFn = one.execNameFn.bind(two)
newFn(1,2)
// 返回值 two 1 2