0

関数式と宣言、コールバック、巻き上げについての割り当てを読みましたが、このほとんどの一般的なアイデアを理解しましたが、以下のコードのために概念を完全に把握できないと思います。コードを投稿してから質問させてください本当の質問。

    var url = "beverages.txt";


   var GridModel = function () {
        this.items = ko.observableArray();
        var me = this;
        $.ajax({
            datatype: 'json',
            url: "beverages.txt"
        }).done(function (data) {
            debugger;
            var jsonData = $.parseJSON(data);
            me.items(jsonData);
        });
    };


    var model = new GridModel();

    // prepare the data
    var source =
    {
        datatype: "observablearray",
        datafields: [
            { name: 'name' },
            { name: 'type' },
            { name: 'calories', type: 'int' },
            { name: 'totalfat' },
            { name: 'protein' },
        ],
        id: 'id',
        localdata: model.items
    };

    var dataAdapter = new $.jqx.dataAdapter(source);

    $("#grid").jqxGrid(
    {
        width: 670,
        source: dataAdapter,
        theme: 'classic',
        columns: [
          { text: 'Name', datafield: 'name', width: 250 },
          { text: 'Beverage Type', datafield: 'type', width: 250 },
          { text: 'Calories', datafield: 'calories', width: 180 },
          { text: 'Total Fat', datafield: 'totalfat', width: 120 },
          { text: 'Protein', datafield: 'protein', minwidth: 120 }
        ]
    });

    ko.applyBindings(model);
});

わかりましたので、このコードは正常に動作し、var model = new GridModel(); によって ajax リクエストを呼び出します。問題は、デバッガーを追加した場合です。var model = new GridModel(); の後のステートメント それは失敗します。また、ajax リクエスト内のデバッガー ステートメントは起動しませんが、var model = new GridModel(); の後にデバッガー ステートメントを削除すると、その後、ajax が起動し、リクエストをデバッグできます。var GridModel が式であるため、追加のデバッガーで失敗するのはなぜですか。

基本的に私がしたいのは、呼び出すことができる宣言関数を作成することであり、ajax リクエストが完了したら、observableArray を返します。このように関数を変更すると

  function GridModel (param1,param2) {
            this.items = ko.observableArray();
            var me = this;
            $.ajax({
                datatype: 'json',
                url: "beverages.txt"
            }).done(function (data) {
                debugger;
                var jsonData = $.parseJSON(data);
                me.items(jsonData);
            });
            return me
        };

次に、この var myitems = GridModel(param1,param2) のような関数を呼び出して、myitems が ajax リクエストの結果を保持することを期待しています。コード実行フローがどのように機能するかを完全には理解していません.bottom関数が機能しない理由と、それを機能させる方法を誰かが説明できれば幸いです。

ありがとう、ダン

4

2 に答える 2

3

非同期操作 (Ajax リクエストなど) があり、他のすべてがその結果に依存する場合は、 callback からプログラムのフローを再開します。ステートメントは使用できませんreturn。同期コードでのみ機能します。

GridModelコンストラクターを変更して、コールバックをパラメーターとして受け取ることができます。

var GridModel = function (callback) {
    this.items = ko.observableArray();
    $.ajax({
        datatype: 'json',
        url: "beverages.txt"
    }).done(callback);
};

次に、コールバック内からプログラム フローを再開します。

function resumeMyProgramFlow(data) {
    // Now you can use the data, resume flow from here
    debugger;
    var jsonData = $.parseJSON(data);
    model.items(jsonData);
    // etc.
}

そして、GridModel次のようにインスタンス化します。

var model = new GridModel(resumeMyProgramFlow);
于 2013-02-01T01:28:11.263 に答える
2

$.ajax(...).done(...)戻ると、プログラム フローが続行されます。

しかし、バックグラウンドでサーバーにデータを送信し、応答を待つため、ajax 呼び出しはまだ完了していません。これが非同期部分です。サーバーから最終的に応答が到着すると、の部分.done(...)が実行されます

function (data) {
    debugger;
    var jsonData = $.parseJSON(data);
    me.items(jsonData);
}

これは、返されたデータが処理される場所と時期です。

あなたが説明するvar myitems = GridModel(param1,param2)のは同期メソッドです。サーバーへの呼び出しは、それ以上の処理を停止し、応答を待ちます。

これは可能ですが、プログラム フロー全体をブロックします。そのため、ajax 呼び出しは非同期であり、応答はコールバック関数で処理されます。

同期的にやりたいこと

var myitems = GridModel(param1,param2);
// do something with myitems

この方法で非同期に行われます

$.ajax(...).done(function(data) {
    // 1. do something with myitems
});

// 2. this will run usually *before* number 1. above
于 2013-02-01T01:37:40.087 に答える