javascript - 使用addEventListener了解JavaScript回调

我有一个由函数返回的对象文字，然后该对象创建一个iframe，并在该iframe中加载DOM时做一些事情。我希望能够在触发事件时“获取”回调返回的值。这是一个简化的对象：

var myFunc = function (url) {
  return {
      url: url,
      myMethod: function () {

          // some code here to create my iframe.

          var callbackFunc = function (event) {
             // do some stuff with the dom.
             return aValueAsynchronously;
          };

          var async = my_iframe.addEventListener("DOMContentLoaded", callbackFunc, true);
          my_iframe.src = this.url;
      }
  }
}

阅读此代码后，我将按照以下方法使用它：

var myValue = myFunc.myMethod('http://www.example.org');

当example.org完成在iFrame中的加载后，将触发DOMContentLoaded回调，并返回值（经过某种逻辑后）。如何获得将此值分配给myValue（上面的行）？我知道我需要使用回调来做到这一点，但是在哪里和如何进行？

非常感谢您的帮助！

最佳答案

首先，您显示的代码不能由myFunc.myMethod调用，因为函数值没有myMethod属性。而是，该函数返回具有该属性的对象。因此，首先您需要：

var myValue = myFunc('http://foo.com').myMethod();

但是，这只会调用设置回调的方法。要实际访问aValueAsynchronously，可以围绕该值创建一个闭包：

var myFunc = function(url){
  var aValueAsynchronously;
  return {
    val : aValueAsynchronously,
    myMethod: function(){
      var callback = function(evt){
        aValueAsynchronously = ...;
      };
      ...register your callback...
    }
  };
};

var obj = myFunc('http://foo.com');
obj.myMethod();
...some time passes, and eventually the callback occurs...
console.log( obj.val ); // This will be what was set in your callback

但是，相反，我将亲自编写代码，以便可以传入自己的回调以从iframe回调执行，而直接将特殊值传递给回调。 （这听起来令人困惑；请参见下面的代码。）这样，您不必等到该值变为可用时，而是在该值可用时得到通知：

var myFunc = function(url,whenDone){
  return {
    myMethod: function(){
      var callback = function(evt){
        var aValueAsynchronously = ...;
        whenDone(aValueAsynchronously);
      };
      ...register your callback...
    }
  };
};

var myObj = myFunc('http://foo.com',function(specialValue){
  // use specialValue here
});
myObj.myMethod(); // Go

关于javascript - 使用addEventListener了解JavaScript回调，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/7815722/