0

この一連のAJAX呼び出しをよりクリーンにする方法を探しています。使ってみまし$.when()たが、うまくいきませんでした。私のAJAX呼び出しはモデルオブジェクトの内部にあるので、遅延オブジェクトを渡さなかったことが原因だと思います。

これは私がこれまでに持っているものです（いくつかのコードは単純に除外されました）：

var origin_form, destination_form; //assume string input from user
var destination, origin;

getOrigin();

//Gets origin data
function getOrigin(){

   //ASYNC CALL
   model.searchFeature(origin_form, 1, function(data){
     //additional callback code excluded
     origin = data; 
     getDestination();

   });
}

//Gets destination information
function getDestination(){

    //ASYNC CALL            
    model.searchFeature(destination_form, 1, function(data){
        //additional callback code excluded
        destination = data;     
        directions(origin, destination);
    });
}


 function directions(origin, destination){
    //Async call to request directions from google api
 }

どんなアドバイスも素晴らしいでしょう！

編集：私はに似たいくつかの解決策を探してい$.when()ます。directions() 基本的に、私は両方getOrigin()の後に呼び出したいのでgetDestination()、ネストされたコールバックなしで実行されます。

4

2 に答える 2

1

user1689607による上記の回答は、コールバックの配置を改善する方法についての良い提案を提供します。

ただし、コールバックをクリーンにするだけでなく、このコードをさらに改善できると思います。1つは、キャメルケースを使用してjslintしてから、次のようにします。

// Use a closure/namespace for global abatement
MyNamespace = (function() {
  // Use a single 'var' declaration
  var originForm, 
      destinationForm, //assume string input from user
      destination, 
      origin;

  function init() {
    getOrigin();
  }

  //Gets origin data
  function getOrigin(){

     //ASYNC CALL
     model.searchFeature(origin_form, 1, function(data){
       //additional callback code excluded
       destination = data; 
       getDestination();

     });
  }

  //Gets destination information
  function getDestination(){
      //ASYNC CALL            
      model.searchFeature(destinationForm, 1, function(data){
          //additional callback code excluded
          destination = data;     
          directions(origin, destination);
      });
  }


  function directions(origin, destination){
    //Async call to request directions from google api
  }

  return {
    'init': init
  };
}());

MyNamespace.init();
于 2012-11-15T17:23:06.413 に答える
1

共有スコープで変数を使用する代わりに、関数から関数に値を渡すだけです。

var origin_form, destination_form; //assume string input from user

getOrigin();

function getOrigin(){
   model.searchFeature(origin_form, 1, getDestination);
}

function getDestination(origin){           
    model.searchFeature(destination_form, 1, function(data) {
        directions(origin, data);
    });
}

function directions(origin, destination){
    //Async call to request directions from google api
}

または を使用Function.prototype.bindすると、もう少しクリーンアップできます。

var origin_form, destination_form; //assume string input from user

getOrigin();

function getOrigin(){
   model.searchFeature(origin_form, 1, getDestination);
}

function getDestination(origin){  
    model.searchFeature(destination_form, 1, directions.bind(null, origin));
}

function directions(origin, destination){
    //Async call to request directions from google api
}

に渡される最初の引数は.bind()、の値を設定nullするかどうかわからないためです。もしそうなら、あなたがなりたいものに置き換えてください。thisdirections()nullthis

于 2012-11-15T17:12:16.250 に答える