1

jQuery を使用して 3 つのサービスを呼び出そうとしています。最初の 2 つはデータを取得し、3 番目はデータを使用して更新を行います。

パート 1: 銀行口座情報を取得したい:

  • Foo Bank から小切手を受け取りたい
  • バーバンクから貯金をもらいたい

パート 2: 両方の銀行から情報を取得できたら、それを自分のサービスで自分の小切手帳にアップロードしたいと考えています。

以下は、Javascript に似た疑似コードです。仕事をするための同期コードを書くことができれば、私が書くようなものですが、それができないことはわかっています。

--PSEUDO CODE

var go = function () {
    var acctId;

    acctId = 12345;
    var myInfo = getAccounts(acctId);
    updateCheckbook(myInfo);
}

var getAccounts = function(acctId){
    var myInfo;

    myInfo = {
        id: acctId,
        fooDollars: GetFooBank(acctId),
        barDollars: GetBarBank(acctId)
    };

    return myInfo;
}

var updateCheckbook(myInfo){
    $.post('http://mySite.com/checkbook/', myInfo);
}

//I want to get the amount from my foo bank account
//Foo Bank uses a web service that allows cross site access
//No bank would ever do this, but I just want to understand how to with $.getJSON.
var fooDollars = function (id) {
    var value;
    $.getJSON('http://foobank.com/accounts/' + id, null, function (data) {
        value = data.checking;
    });

    //I'm pretty sure this is wrong with an asynchronous call.
    return value;
};

var barDollars = function (id) {
    //have to use jsonp for bar bank
    $.ajax({
        url: 'http://barbank.com/accounts/' + id + '&callback=updateBar',
        dataType: 'jsonp'
    });

    //Not really sure how to return a value from a jsonp ajax call
    return value;
};

function updateBar(data) {
    //Need to take data.savings and get the value back to getAccounts.
    //How? I have no idea. 
}

jQuery の遅延メソッドが何をするかはある程度理解できますが、すべての部分がどのように組み合わされるかについては少し混乱しています。特に：

  1. パート 1 では、次のステップに進む前に、両方の銀行口座サービスが完了するのを待つ必要があります。jQuery は複数の遅延の待機を処理しますが、複数の関数が値を返すのを待機する方法を理解できませんでした。
  2. パート 1 の Foo Bank では、$.getJSON. 返されたデータ オブジェクトを取得し、data.checking を取得します。その情報を getAccounts() に戻すにはどうすればよいですか?
  3. パート 1、Bar Bank、2 に似ていますが、JSONP でそれを行うにはどうすればよいですか?
  4. 私が完全に軌道から外れていて、別の見方をする必要がある場合は、そのフィードバックも高く評価されます。
4

2 に答える 2

3

fooDollars()コツは、とbarDollars()(および からの適切な尺度) からの値ではなく、リターンの約束updateCheckbook()です。$.when().then()in はgo()、両方の promise が満たされるのを待ってから、コールバックを起動します。

現在の関数のラインナップに固執し、（可能な限り）疑似コードを実際のコードに変換すると、次のようになります。

var go = function () {
    var acctId = 12345;
    $.when.apply(null, getAccounts(acctId)).then(function(a1, a2){
        return updateCheckbook({
            id: acctId,
            fooDollars: a1[0].checking,
            barDollars: a2[0].savings
        });
    }).done(function() {
        alert("Checkbook updated");
    });
}

var getAccounts = function(acctId){
    return [
        fooDollars(acctId),
        barDollars(acctId)
    ];
}

var updateCheckbook(myInfo){
    return $.post('http://mySite.com/checkbook/', myInfo);
}

var fooDollars = function (id) {
    return $.getJSON('http://foobank.com/accounts/' + id);
};

var barDollars = function (id) {
    return $.ajax({
        url: 'http://barbank.com/accounts/' + id,
        dataType: 'jsonp'
    });
};

必要に応じて、 andを から直接切り出してgetAccounts()呼び出すことで、これを少し単純化できます。fooDollars()barDollars()go()

よくわからないのはjsonpだけです。作業が必要かもしれません。

于 2013-06-26T21:10:12.580 に答える
2

非同期関数は値を返しません。それがあなたのコードの最大の欠陥です。fooDollars返品不可value。getAccounts戻ることはできません（ ajaxも実行するとmyInfo仮定します）。getAccounts

代わりに、関数がjqXHRオブジェクトを返すようにします (これは promise オブジェクトでもあります)。

var fooDollars = function (id) {

    return $.getJSON('http://foobank.com/accounts/' + id);

};

getAccounts（私はそれもajaxを行うと仮定します）で同じことを行うと、これを行うことができます：

$.when(fooDollars('foo'),getAccounts('bar')).done(function(fD,gA){
    console.log(fD[0].checking);
    console.log(gA[0]);
})
于 2013-06-26T20:46:08.393 に答える