关于javascript:applycallbind三者区别

8次阅读

共计 1068 个字符,预计需要花费 3 分钟才能阅读完成。

apply call bind 它们是一个能够扭转函数 this 指向的办法

// 以 call 为例
var name = 'window name'
function show_name(){console.log(this.name)
}

show_name()  // window name

var person = {name: 'person name'}
show_name.call(person) // person name

apply call bind 同时能够向函数外部传递参数

// 以 call 为例
var name = 'window name'
function show_info(age,sex){console.log(this.name + ':' + 'age:' + age + 'sex:' + sex)
}
show_info(28,'男')   // window name:age:28sex: 男

var person = {name: 'person name'}
show_info.call(person,28,'男')   // person name:age:28sex: 男 

三者的区别

  • apply 和 call 都能够被动触发函数调用,bind 具备返回值,须要手动触发
  • call 和 bind 的传参模式一样,apply 是以数组的模式传参
// apply 和 call 都能够被动触发函数调用,bind 须要手动触发
function show_info(age,sex){console.log(this.name)
}
var person = {name: 'person name'}
show_info.call(person)   // person name
show_info.bind(person)   // 无成果

const fun = show_info.bind(person)
fun()
// call 和 bind 的传参模式一样,apply 是以数组的模式传参
function show_info(age,sex){console.log(this.name + ':' + 'age:' + age + 'sex:' + sex)
}

var person = {name: 'person name'}
show_info.call(person,28,'男')   // person name:age:28sex: 男
const fun = show_info.bind(person,28,'男')
fun()  // person name:age:28sex: 男

show_info.apply(person,[28,'男']) // person name:age:28sex: 男 

注:es6 中箭头函数不能用以上办法批改 this 指向

正文完
 0