了解道场搭便车

Question

我正在努力理解dojo工具包的hitch功能.我在https://dojotoolkit.org/reference-guide/1.10/dojo/_base/lang.html查看此示例,其中包括:

require(["dojo/_base/lang"], function(lang){
var myObj = {
    foo: "bar",
    method: function(someArg){
      console.log(this.foo);
    }
  };

  var func = lang.hitch(myObj, "method");

  func();
});

是不是可以通过myObj.method(arg)来使用该功能？谢谢

Answer 1

是不是可以通过myObj.method(arg)代替使用该功能？

是的,它是在那种特殊情况下,但是需要将函数引用传递给其他代码是很常见的,并且函数引用不会(默认情况下)携带任何特定的this烘焙内容; this根据你如何调用函数来设置.

因此,例如,如果您使用myObj.method作为事件处理程序,当它被调用时,this在调用期间将不会引用该对象myObj引用.

hitch通过创建一个新函数来修复它,当调用它时,将this正确调用您的方法.

它已经过了一段时间了,ES5(2009年)推出Function#bind,它做了同样的事情.但是Dojo Toolkit最初是在2005年创建的,因此它包含了这样的实用程序.这是使用相同的代码Function#bind:

require(["dojo/_base/lang"], function(lang){
  var myObj = {
    foo: "bar",
    method: function(someArg){
      console.log(this.foo);
    }
  };

  var func = myObj.method.bind(myObj);

  func();
});

这是一个实例,演示了它在事件处理程序中的重要性:

var obj = {
  foo: "bar",
  method: function() {
    console.log("this.foo = " + this.foo);
  }
};
document.getElementById("unbound").addEventListener("click", obj.method, false);
document.getElementById("bound").addEventListener("click", obj.method.bind(obj), false);

<input type="button" id="unbound" value="Unbound">
<input type="button" id="bound" value="Bound">