使用回调使javascript函数异步

时间:2013-01-29 11:31:42

标签: javascript jquery ajax

以前我有

 MyClass.prototype.method1 = function(data1) {
    return this.data111.push(data1);
  };

 MyClass.prototype.method2 = function(i) {
    var data = this.method1(i);
    if (data.condition1 != null) {
      data.onEvent1(this);
    }
    return $(data.element).someMethod123("data123");
  };

 MyClass.prototype.method3 = function() {
    var data1 = this.method1(this._data1);
    return this.someMethod123(step.data1);
  };

MyClass.prototype.ended = function() {
    return !!this.getState("end");
  };


MyClass.prototype.getState = function(key) {
    var value = $.cookie(key);
    this._options.afterGetState(key, value);
    return value;
  };

如何使用回调函数进行异步?我想它应该是这样的:

 MyClass.prototype.method1 = function(data1, callback) {
    if(callback){
      callback(this.data111.push(data1));
    }
    else{
      return this.data111.push(data1);
   }
  };

 MyClass.prototype.method2 = function(i, callback) {

    var data = this.method1(i);
    if (data.condition1 != null) {
      data.onEvent1(this);
    }
    if(callback){
      callback($(data.element).someMethod123("data123"));
    }
    else{
     return $(data.element).someMethod123("data123");
    }
  };

 MyClass.prototype.method3 = function(callback) {
    var data1 = this.method1(this._data1);
     if(callback){
      callback(this.someMethod123(step.data1));
    }
    else{
       return this.someMethod123(step.data1);
    }
  };

MyClass.prototype.ended = function(callback) {
    if(callback){
       callback(!!this.getState("end", /*what should be here and what should it does?*/));
    }
  };


  MyClass.prototype.getState = function(key, callback) { 
    var oldThis = this;
    setTimeout(function(){ 
                    value = $.cookie(key);
                    callback(value, oldThis); 
                    oldThis._options.afterGetState(key, value);
                  },
              0);
  };

我肯定错过了一些东西,因为我之前从未在javascript中使用异步函数。那是吗?

而且,据我所知,为了使函数异步,我基本上应该添加一个参数作为回调函数并摆脱返回,不应该吗?

2 个答案:

答案 0 :(得分:1)

传递回调:

MyClass.prototype.ended = function(callback) {
    this.getState("end", callback);
};

您也应该在其他功能中执行此操作,我建议您坚持使用一个界面。即要么直接返回值(如果可能),要么使用回调。

答案 1 :(得分:1)

只有那些执行异步任务的方法才需要回调样式。没有理由将其用于method1method2method3

getState现在是实际的异步方法。使用ajax / setTimeout /在这里很明显。然而,我可以发现一个错误:callback调用应始终是最后一个语句,就像在return语句后你不会做任何事情一样。即使可以,也可以在设置内部选项对象后更好地回电

                …
                oldThis._options.afterGetState(key, value);
                callback(value, oldThis);

现在,ended方法。由于它使用异步getState,它将变为异步本身,您需要使用回调样式(请注意getState()不会返回值)。因此,您将调用getState,当回调时,您将转换结果并将其传递给您自己的回调:

MyClass.prototype.ended = function(callback) {
    this.getState("end", function ownCallback(state) {
        var result = !!state; // or whatever you need to do
        callback(result);
    });
};
// and if you don't need to do anything with the result, you can leave out ownCallback:
MyClass.prototype.ended = function(callback) {
    this.getState("end", callback);
};