Question

我有一个函数返回的对象文字，反过来，这个对象会创建一个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');

当在iFrame中加载example.org时，会触发DOMContentLoaded回调，并返回值（在某些逻辑之后）。如何将此值分配给myValue（上面的行）？我知道我需要使用回调来做到这一点，但在哪里以及如何？

非常感谢你的帮助！

Answer 1

首先，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

Answer 2

如果 myValue 在 callBack 的范围内，只需分配给它。如果它不在范围内，则必须将其作为某个对象的属性进行访问，并且对该对象的引用必须在 callBack 的范围内。

在简单的情况下，如果 myValue 是全局的并且您希望代码在浏览器中运行，那么 callBack 可以设置window.myValue = ...;。否则， callBack 需要将其作为全局对象的属性（相当于浏览器中的 window ）进行访问。

所以在你的功能中你可能有：

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

         window.myValue = aValueAsynchronously;

         return aValueAsynchronously;
      };

或者我完全错过了这一点？

使用addEventListener了解javascript回调

2 个答案: