0

我过去工作的几个网站主要使用 jquery 进行事件驱动，我通常使我的功能如此

function abc() {
    //do stuff
}
abc();

和

function foo() {
    var a = $('.aaa');
    var b = $('.bbb');
    var c = $('.ccc');

    function animal() {
        //do stuff
    }
    animal();

    function pet() {
        //do stuff
    }
    pet();
}
foo();

我知道这不是最佳做法，但我仍在学习，它似乎有效。我只是想知道我现在应该如何处理这个问题。

4

3 回答 3

1

阅读编写一致、惯用的 JavaScript 的原则。这是一个非常好的 Javascript 风格指南。

于 2012-08-17T13:53:20.807 回答
1

实际上，如果您在全局范围内定义所有这些函数（如全局对象窗口的属性/方法），则示例中的代码（第一个）并不是您可以做的最好的事情。我更喜欢使用模块模式http://addyosmani.com/resources/essentialjsdesignpatterns/book/#modulepatternjavascript 我建议你在上面的链接中阅读整本书。另一件事非常有用 - Stoyan Stefanov 的 JS 模式书http://www.amazon.com/JavaScript-Patterns-Stoyan-Stefanov/dp/0596806752。

您的示例（第二个）的另一种选择是自动执行功能：

(function () {
   //attaching events and doing all other stuff
}());

首次加载页面时，自执行函数可帮助您进行一些初始化工作。你可以附加事件或/和做其他你应该做的事情。它可以防止您污染全局范围并多次执行 init。

于 2012-08-17T14:06:17.213 回答
0

我通常会选择这样的东西。将整个代码包装在一个闭包中，并在将所有必需的方法和变量附加到一个命名空间对象之后返回一个命名空间对象。

var myApp = (function foo() {
    "use strict";
    var myApp = {

        a       : $('.aaa'),
        b       : $('.bbb'),
        c       : $('.ccc'),
        animal  : function () {
            //do stuff
        }
    };

    myApp.pet =  function () {
        //do stuff
    };

    return myApp;
}());


myApp.animal();
于 2012-08-17T17:31:38.120 回答