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 を使用することをお勧めします。上のリンクにある本全体を読むことをお勧めします。非常に便利なもう1つのこと-StoyanStefanovのJSパターンブックhttp://www.amazon.com/JavaScript-Patterns-Stoyan-Stefanov/dp/0596806752。

あなたの例の別の代替案（2番目のもの）は自己実行関数です：

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

自己実行関数は、ページを初めてロードするときに初期化作業を行うのに役立ちます。イベントを添付したり、一度実行する必要のある別のことを実行したりできます。これにより、グローバルスコープを汚染したり、initを複数回実行したりするのを防ぐことができます。

于 2012-08-17T14:06:17.213 に答える
0

私は一般的にこのようなものを選びます。コード全体をクロージャでラップし、必要なすべてのメソッドと変数をそのオブジェクトにアタッチした後、1つの名前空間オブジェクトを返します。

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 に答える