0

我最近遇到了类似的代码，

// Simplified example..
var Application = 
    {
        MemberVar1: null,
        MemberVar2: null,

        Initialize: function ()
        {
            Application.MemberVar1 = 'Foo';
            Application.MemberVar2 = 'Bar';

            console.log("Initializing..");

            Application.GetMemberVars();
        },
        GetMemberVars: function ()
        {
            console.log(Application.MemberVar1 + ' ' + Application.MemberVar2);    
        }
    };

$(Application.Initialize);

这种模式/方法/风格的名称是什么？在不使用我以前见过的样式的情况下使用 OOP 原则，例如原型设计。与其他流行的风格相比，这种风格有什么好处？

4

3 回答 3

3

这是一个正在创建的简单的一次性对象文字......它们可以包含函数......也许这就是你的原因。

最后一行只是将Application.Initialize函数作为$(document).ready回调函数传递给 jQuery

根据下面的评论，这就是代码的实际作用（以及如何更短/更容易地编写它）

$(function()
{
    console.log("Initializing..");
    console.log("Foo Bar");//replace this with variables you declare @top of anon. function if you want
});

作为一个模块（您可以在此处找到有关模块模式的更多信息）：

var Application = (function()
{
    var memberVar1, memberVar2,
    getMemberVars = function()
    {
        return memberVar1 + ' ' + memberVar2;
    };
    return {init: function()
    {
        memberVar1 = 'Foo';
        memberVar2 = 'Bar';
        console.log('initializing...');
        console.log(getMemberVars());
    }};
}());
$(Application.init);

Application现在是一个对象字面量，只有 1 个属性 ( init)：一个函数，因为它是在该 IIFE 的范围内声明的，所以可以访问该范围内的所有本地变量。这就是闭包的魔力。您也可以轻松地为成员变量添加 getter 和 setter：

var Application = (function()
{
    var memberVars = {},//turned into object literal...
    getMemberVars = function(all)
    {
        var i;
        if(typeof all === 'string' || typeof all === 'number')
        {
            return memberVars[all];
        }
        all = [];
        for (i in memberVars)
        {
            if (memberVars.hasOwnProperty(i))
            {
                all.push(memberVars[i]);
            }
        }
        return all;//or all.join(' '), as you please
    },
    get = function(name)
    {

        return typeof name === 'undefined' ? name : memberVars[name]; 
    },
    set = function(name, val)
    {
        memberVars[name] = val;
    };
    return {init: function()
    {
        memberVars.one = 'Foo';
        memberVars.two = 'Bar';
        console.log('initializing...');
        console.log(getMemberVars().join(' '));
    },
    get: get,
    set: set};//just add getter and setter here
}());
于 2013-05-02T20:13:04.020 回答
1

这与您的代码具有相同的行为：

var Application = (function() {
    var app = {
        MemberVar1: null,
        MemberVar2: null,
        GetMemberVars: function() { /* ... */},
        Initialize: function() {
            this.MemberVar1 = 'Foo';
            this.MemberVar2 = 'Bar';
            console.log('Initializing..');
            this.getMemberVars();
        }
    };
    $(function() {app.Initialize();});
    return app;
}());

但是很有可能您并不真的希望该Initialize功能一直存在。所以这将简化它：

var Application = (function() {
    var app = {
        MemberVar1: null,
        MemberVar2: null,
        GetMemberVars: function() { /* ... */}
    };
    $(function() {
        app.MemberVar1 = 'Foo';
        app.MemberVar2 = 'Bar';
        console.log('Initializing..');
        app.getMemberVars();
    });
    return app;
}());

除非你真的担心代码试图Application.MemberVar1在 jQuery 事件之前访问等，否则你document.ready可以将其进一步简化为：

var Application = (function() {
    var app = {
        GetMemberVars: function() { /* ... */}
    };
    $(function() {
        app.MemberVar1 = 'Foo';
        app.MemberVar2 = 'Bar';
        console.log('Initializing..');
        app.getMemberVars();
    });
    return app;
}());

我假设定义这些MemberVars 需要一些实际的工作，而不是像示例中那样简单的字符串。如果不是这种情况，那么我会最后切换到

var Application = (function() {
    var app = {
        MemberVar1: 'Foo';
        MemberVar2: 'Bar';
        GetMemberVars: function() { /* ... */}
    };
    $(function() {
        console.log('Initializing..');
        app.getMemberVars();
    });
    return app;
}());
于 2013-05-02T20:47:45.143 回答
1

如果您只想使用某个对象的一个​​实例，则不需要使用原型。

在这种情况下，很明显 Application 对象是独一无二的，作者并不打算创建任何额外的 Application 副本。

说到风格……那个大写的驼色案看起来很丑。共同的协议是仅将 CapitalCamelCase 用于对象构造函数。我个人认为也可以用于具有逻辑的独特对象（应用程序）。但应避免将其用于函数名称和变量。

谈论模式......它接近单例模式。但不要想太多。来自 Java 世界的所有这些 OOP 模式在 JS 世界中失去了部分吸引力。其中一些完全瓦解。专注于解决问题的JS方法。

于 2013-05-02T20:51:17.010 回答