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次,但在函数引用中,我试图通过命名变量来引用每个实例,即:

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 模块的引用,并根据我的需要实例化它,如下所示:

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...
}

所以..现在一切正常!

我想我唯一需要做的另一件事是查找清理过程以确保释放这些对象..但是只会有几个..但仍然..

再次感谢@asgoth

于 2013-01-08T17:56:01.097 回答
2

只需返回一个函数而不是这样的对象

return function(){
    return {
        // your public interface goes here
    };
}

现在您可以使用new componentName().

于 2015-02-02T15:08:26.353 回答