7

私は明らかにいくつかの概念/理解が欠けており、最も間違いなくjavascript OOの基本です!

私は RequireJS を愛用しており、私の Web アプリは今ではクレイジーなコードの山全体ではなく、構造化されたアプリのように見えます。

次のことが可能かどうかを理解するのに苦労しています。

次のように、 dataservice_baseという基本データサービス モジュールとして機能するモジュールがあります。

define(['dataservices/dataservice'], function (dataservice) {

    // Private:     Route URL
    this.route = '/api/route-not-set/';
    var setRoute = function (setRoute) {
        this.route = setRoute;
        return;
    }

    //  Private:    Return route with/without id 
    var routeUrl = function (route, id) {
        console.log('** Setting route to: ' + route);
        return route + (id || "")
    }

    //  Private:    Returns all entities for given route
    getAllEntities = function (callbacks) {
        return dataservice.ajaxRequest('get', routeUrl())
        .done(callbacks.success)
        .fail(callbacks.error)
    };

    getEntitiesById = function (id, callbacks) {
        return dataservice.ajaxRequest('get', routeUrl(this.route, id))
        .done(callbacks.success)
        .fail(callbacks.error)
    };

    putEntity = function (id, data, callbacks) {
        return dataservice.ajaxRequest('put', routeUrl(this.route, id), data)
        .done(callbacks.success)
        .fail(callbacks.error)
    };

    postEntity = function (data, callbacks) {
        return dataservice.ajaxRequest('post', routeUrl(this.route), data)
        .done(callbacks.success)
        .fail(callbacks.error)
    };

    deleteEntity = function (id, data, callbacks) {
        return dataservice.ajaxRequest('delete', routeUrl(this.route, id), data)
        .done(callbacks.success)
        .fail(callbacks.error)
    };

    //  Public:     Return public interface
    return {
        setRoute: setRoute,
        getAllEntities: getAllEntities,
        getEntitiesById: getEntitiesById,
        putEntity: putEntity,
        postEntity: postEntity,
        deleteEntity: deleteEntity
    };

});

ご覧のとおり、dataservices/dataservice を参照しています。これは、実際にはコア AJAX 呼び出しメカニズムです (表示されていませんが、ラッパーでの基本的な jQuery ajax 呼び出しにすぎません)。

私がやろうとしているのは、この基本データサービス モジュールを次のように「インスタンス化」できるようにすることです (別のモジュール内 - スニペット コードのみ)。

define(['dataservices/dataservice_base', 'dataservices/dataservice_base', 'dataservices/dataservice_base'], function (dataservice_profile, dataservice_qualifications, dataservice_subjects) {

    //  Set the service route(s)
    dataservice_profile.setRoute('/api/profile/');
    dataservice_qualifications.setRoute('/api/qualification/');
    dataservice_subjects.setRoute('/api/subject/');

ご覧のとおり、同じdataservice_base (上記で定義) を 3 回インクルードしようとしていますが、関数参照では、vars という名前で各インスタンスを参照しようとしています。

dataservice_profile、dataservice_qualifications、dataservice_subjects

..そしてもちろん、モジュールでさらに使用するために、これらのインスタンスのそれぞれに一意のsetRoute値を設定できるようにしようとしています..一般的な呼び出し (get、puts、posts など) を活用します。

明らかに、私はここでいくつかのことを見逃しています..しかし、私を道に戻すための助けがあれば、非常に感謝しています!!

敬具、デビッド。

4

3 に答える 3

7

依存関係を一度だけ含めて、 newキーワードを使用する必要があると思います。おそらく、共通の関数が依存モジュールにあるようにリファクタリングする必要があります。

define(['dataservices/dataservice'], function (dataservice) {
    var dataservice_profile = new dataservice();
    var dataservice_qualifications = new dataservice();
    var dataservice_subjects = new dataservice();

    //  Set the service route(s)
    dataservice_profile.setRoute('/api/profile/');
    dataservice_qualifications.setRoute('/api/qualification/');
    dataservice_subjects.setRoute('/api/subject/');

    // define needs to return something
    return {
       profile: dataservice_profile,
       qualifications: dataservice_qualifications,
       subjects: dataservice_subjects
    };
});
于 2013-01-08T17:42:57.650 に答える
4

はい、脳フリーズか何か.. 時々一人で働く問題！

したがって、@asgoth が述べたように、当然のことながら、私の心をクリアにして、少し考えなければなりませんでした。

次のように、リファクタリングされた dataservice_base モジュールになりました。

define(['dataservices/dataservice'], function (dataservice) {

    //  Set any class/static vars

    //  Set the instance function
    function dataservice_base(setRoute) {

        var self = this;

        self.route = setRoute;
        console.log('setting route: ' + self.route);

        function routeUrl(route, id) {
            console.log('** Setting route to: ' + route);
            return route + (id || "")
        }

        self.getAllEntities = function (callbacks) {
            return dataservice.ajaxRequest('get', routeUrl())
            .done(callbacks.success)
            .fail(callbacks.error)
        }

        self.getEntitiesById = function (id, callbacks) {
            return dataservice.ajaxRequest('get', routeUrl(self.route, id))
            .done(callbacks.success)
            .fail(callbacks.error)
        }

        self.putEntity = function (id, data, callbacks) {
            return dataservice.ajaxRequest('put', routeUrl(self.route, id), data)
            .done(callbacks.success)
            .fail(callbacks.error)
        }

        self.postEntity = function (data, callbacks) {
            return dataservice.ajaxRequest('post', routeUrl(self.route), data)
            .done(callbacks.success)
            .fail(callbacks.error)
        }

        self.deleteEntity = function (id, data, callbacks) {
            return dataservice.ajaxRequest('delete', routeUrl(self.route, id), data)
            .done(callbacks.success)
            .fail(callbacks.error)
        }

    } // eof instance

    return dataservice_base;
}

もちろん、@asgoth が述べたように、dataservice_base モジュールへの参照を 1 つ含めるだけで済み、必要に応じて次のようにインスタンス化する必要があります。

define(['dataservices/dataservice_base','viewmodels/viewmodel_profile', 'viewmodels/viewmodel_qualifications', 'viewmodels/viewmodel_subjects', 'app/common'], function (dataservice_base, viewmodel_profile, viewmodel_qualifications, viewmodel_subjects, common) {

    var dataservice_profile = new dataservice_base('/api/profile/');
    var dataservice_qualifications = new dataservice_base('/api/qualification/');
    var dataservice_subjects = new dataservice_base('/api/subject/');

    // do whatever now with those instance objects...
}

SO ..すべてが機能するようになりました！

私がする必要がある唯一の他のことは、これらのオブジェクトが確実に解放されるようにするためのクリーンアッププロセスについて調べることだと思います..しかし、これまでにいくつかしかありません..

ありがとう@asgoth

于 2013-01-08T17:56:01.097 に答える