2

この種のものは初めてなので、デザインの提案をお願いします。私がこのようなものを持っているとしましょう

$(function () {
    $('#menuBtn').on('click', app.openUsersMenu);
});
var app = {
    users: null,
    openUsersMenu: function () {
        if (app.users != null) {
            //render menu
        } else {
            $.ajax({
                url: '/getUsers.json'
            }).success(function (data) {
                app.users = data;
                //render menu     
            });
        }
    }
}

遅延読み込みとキャッシュを行う良い方法ですか、それともより良い代替案を提案しますか? レンダリング関数を 2 回書くのを避けるための通常の解決策は何ですか? もちろん、次のようなものを使用できます。

var app = {
    users: null,
    openUsersMenu: function() {
        if (app.users != null) {
            app.renderMenu();
        } else {
            $.ajax({
                url: '/getUsers.json'
            }).success(function (data) {
                app.users = data;
                app.renderMenu();  
            });
        }
    },
    renderMenu: function() {
        //use app.users to render
    }
}

しかし、その後、2 つの関数とその名前がややこしくなるので、次のようにしたほうがよいでしょう。

var app = {
    users: null,
    openUsersMenu: function () {
        if (app.users != null) {
            //render menu
        } else {
            $.ajax({
                url: '/getUsers.json'
            }).success(function (data) {
                app.users = data;
                app.openUsersMenu(); // Call itself, now with data    
            });
        }
    }
}

最後のパターンは良い考えですか？これを行う通常の方法は何ですか？

4

1 に答える 1

2

キャッシュに使用できるさまざまなライブラリやそのようなもの ( amplifyJSなど) について多くの提案が得られると確信しており、それらには適切な場所があります。しかし、実行しているのはメモリ内にキャッシュすることだけであれば、ソリューションはまったく問題ありません。内部的には、メモリ内キャッシュのためにライブラリが行うことは、少し抽象化されているだけです。

しかし、あなたが持っているものはシンプルで理解しやすく、そして何よりも機能します。

コードをロード/キャッシュするためのさまざまなオプションについて。renderMenu を直接呼び出さない場合は、openUsersMenu 内に移動して非公開にします。

var app = {
    users: null,
    openUsersMenu: function() {
        var renderMenu = function() {
            //use app.users to render
        };

        if (app.users != null) {
            renderMenu();
        } else {
            $.ajax({
                url: '/getUsers/json'
            }).success(function (data) {
                app.users = data;
                renderMenu();  
            });
        }
    }
}

それ以外の場合、オプション 2 は桃色です。Lee Meador の言うとおりです。オプション #3 はクールですが、少し読みにくいです。さらに説明が必要な場合はお知らせください。

于 2013-01-24T17:32:56.520 に答える