JavaScript中的call,apply与bind

一.它们有什么作用?

都可以改变this的指向

<script>

let obj = {name: 'Pray', age: 20}
// 这里不能写箭头函数, 因为箭头函数中的this始终指向当前这个函数
// let fun = () => console.log(this)
// 先声明函数
let fun = function (arg) {
console.log(this, arg)
}
// 这里打印的this为Window对象
fun()

// 下面执行函数打印的三个this都为obj中的对象,而不是Window
fun.call(obj)
fun.apply(obj)
fun.bind(obj)() // bind只是将函数返回 ,需要自己去调用
console.log('----------------------')
// 传参的区别 (apply的参数必须是数组, 存放在数组里面, 其它不需要)
fun.call(obj, 'arg')
fun.apply(obj, ['arg'])
fun.bind(obj, 'arg')()

</script>

二 .它们有什么不同 ?

1.bind绑定完this不会立即执行, 而是会将函数返回出来

2.apply传参必须是数组这种格式

三. 应用

修改回调中的this (vue, react 经常使用到!)

let obj = {name: 'Pray', age: 20}
setTimeout(function () {
<!--此时this为obj对象-->
console.log(this)
}.bind(obj),1000)

10月11日补充, 当apply指向null或者 undefined 时

我在网上看到一个关于 apply 指向的代码, 看完代码 , 代码如下

oldParseInt.apply(null, arguments);

当一个 apply 指向 null 时, 代表了什么呢? 我很好奇的问了些朋友讨论了一下 , 其实, 当 apply 指向 null或者undefined 时, 这个this指向代表了全局对象, 可以是Windows 或者 global(nodejs) 。 在严格模式下, 会报错, null 只代表了个值, 没有意义

分享到