javascript - obj.func(arg) 和 obj.func.bind(obj, arg) 之间的区别

Question

我刚刚在一段 React 代码中发现了以下结构(名称已更改):

<MyActionComponent callback={this.func.bind(this, arg)}>

据我了解，bind 只是执行相应的函数，并将函数的 this 设置为第一个参数，并向其传递更多参数。由于 func 已经是我们想要的 this 对象的属性，因此 this.func(arg) 似乎会产生相同的结果行为。

我看不出对于相同的功能来说似乎更复杂的语法背后的动机。与 obj.func.bind(obj, arg) 相比，是否存在 obj.func(arg) 的行为有所不同的上下文？或者是否有我不知道的非技术方面(例如约定、一致性)？

Answer 1

关键区别在于 obj.func(arg) 执行该函数，而 func.bind(obj, arg) 执行>不执行该函数。它仅确保一旦函数 get 实际执行，this 就会绑定(bind)到 obj。

看这里:

var obj = {
  fooFn: function() {console.log("this = ", this)}
}

obj.fooFn() // => prints "this = [Object]"

var boundFn = obj.fooFn.bind("bar")
boundFn() // => prints "this = 'bar'"