使用Module模式的主代码

时间:2013-09-12 17:32:50

标签: javascript html5 design-patterns

我是JS设计模式的新手,我想知道我是否做得对。 我正在开发HTML5 Go game。所以很自然地我将我的代码分成了每个实现Module模式的文件。 例如,这是董事会(goban)文件:

var goban = (function() {
    var m_canvas = null,
        m_ctx = null,
        m_canvas_height = null,
        m_canvas_width = null;

    var drawLines = function(line_step, line_limit) {
        ...
    };

    var drawStars = function(first_star_coords, distance_btwn_stars, star_size) {
        ...
    };

    return {
        init: function(canvas, ctx) {
            m_canvas = canvas;
            m_ctx = ctx;
            m_canvas_width = canvas.width;
            m_canvas_height = canvas.height;

            m_ctx.beginPath();

            drawLines(30, 30);
            drawStars(120, 180, 5);

            m_ctx.strokeStyle = "black";
            m_ctx.stroke();
        }
    };
})();

我的主要代码文件:

var main = (function() {
    /* ================================================
    Variables
    =================================================== */
    var canvas = document.getElementById("goban");
    var ctx = canvas.getContext("2d");

    /* ================================================
    Calls
    =================================================== */
    goban.init(canvas, ctx);

    /* ================================================
    Events
    =================================================== */
    $(canvas).click(function(evt) {
        ...
    });
})();

goban模块中的函数将使用canvas或ctx或两者。其他模块也是。这是一个很好的方法吗?我应该将我的“主要”代码设置为全局代码还是应该在每个模块中编写构造函数(如“init”函数)?如果是这样,你如何在这个模式中添加构造函数?有没有更好的方法来实现这一目标?

0 个答案:

没有答案