5

私は次のjavascriptを持っています:

            var MyObject = (function() {

                function Setup(args) {
                    this.prop1 = args.x;
                    this.prop2 = args.y
                    this.prop3 = this.prop1 + this.prop2;

                    this.Create = function() {
                        return 'a' + helperFunc();
                    }

                    function helperFunc() {
                        return this.prop3;
                    }
                }

                return {
                    init : function(args) {
                        var setup = new Setup(args);

                        setup.Create();
                    }
                }

            })();


            $(function() {

                MyObject.init(someArgs);

            });
  1. オブジェクト構築への私のアプローチは良い習慣ですか?

  2. undefinedアクセスしようとすると、helperFunc に入りますthis.prop3

  3. this.prop1 + this.prop2また、ローカル変数に割り当て、関数を使用してこの値を次のように返すことも試みました。

            function Setup(args) {
                    var total;
    
                    this.prop1 = args.x;
                    this.prop2 = args.y
    
                    total = this.prop1 + this.prop2;
                    this.getTotal = function() {
                            return total;
                    };
    
                    this.prop3 = this.prop1 + this.prop2;
                    ...
    

...そして、これを helperFunc で次のように呼び出すと:

                       return this.getTotal();

.. getthis.getTotalは関数ではありません

オブジェクトの作成について読んだり、クロージャーを使用してプライベートメンバーを模倣したりしていますが、オブジェクトを定義する方法が1つもないため、混乱しています。

TBH - 構文がよくわかりません:

                       var myObject = (function() { ... } ();

jQuery プラグインでよく使われているのを見てきましたが、最初の括弧の後に空の括弧が続くのは何を意味し、何をするのでしょうか?

与えられた知識は大歓迎です。

また、JavaScript に関する Douglas Crockford の本を注文していますが、それが届くまで、この問題を解決する必要があります。

4

4 に答える 4

4

彼が言及したXhalentの素晴らしい記事(本当によくできていて、はっきりと書かれている)を引用するには:

これは、「this」の値が、オブジェクトが作成されたときの「this」の値と異なるためです。

だからあなたの場合:

...
  var _this = this.prop3;
  function helperFunc() {
    return _this;
  }
...

望むことを達成するかもしれません。

于 2011-05-17T12:59:09.543 に答える
1

私は基本的なJavaScriptの基礎に関するシリーズを行いました-オブジェクトとプロトタイプはここでカバーされています:

Javascriptオブジェクトのインスタンス化とプロトタイプ

ここでクロージャについて詳しく説明します:Javascriptクロージャ

彼らが助けてくれることを願っています。乾杯。

于 2011-05-17T12:34:28.330 に答える
1

を使用する関数がある場合はthis、呼び出しコンテキストが正しいことを確認する必要があります。つまりthis.helperFunc()、 を使用するだけではありませんhelperFunc()(ただし、 this.helperFunc が定義されるように設定する必要もあります)。あなたの例の helperFunc 内部の指示対象はthis、 と同じではありませんCreate()

関数がオブジェクトのメンバーとして定義されているのではなく、オブジェクトのメンバーとして呼び出されているように考えることができます。

thisコンテキストに応じて、解決される可能性のあることが 3 つあります。

  1. 関数呼び出しの前にnewキーワードがあった場合、新しく作成されたオブジェクト。
  2. 関数が呼び出されたときのドットの左側のオブジェクト。
  3. 上記のいずれも指定されていない場合は、グローバル オブジェクト ( window)。

helperFuncinへの呼び出しの場合のように、関数がオブジェクトなしで呼び出された場合、this.Createthisグローバル オブジェクトにバインドされます (windowブラウザーで使用される場合)。

このようなものを考えると:

var o = {someVal:"hello"};
o.doSomething = function (){alert(this.someVal)};

呼び出すo.doSomething()と、明らかに「こんにちは」と警告されます。

与えられた:

var o2  = {someVal:"world"};
o2.someFunc = o.doSomething;

のメンバーo2.someFunc()へのポインターである場合に予想されるように、呼び出しは「hello」ではなく「world」を警告します。 doSomethingo

そして与えられた:

var someFunc = o.doSomething
someVal = "sailor"

呼び出すsomeFunc()と「セーラー」に警告します。

もう 1 つの混乱点は、this内で直接 を使用することですSetup()。を使用して関数を呼び出すと、newこれまで行ったthisように、グローバル オブジェクトにバインドされず、Setupオブジェクトの新しいインスタンスにバインドされます。

上記の例では、これは、呼び出しnew o.doSomething()用に作成された新しいオブジェクトに「someVal」メンバーがないため、呼び出しが「未定義」と警告することを意味します。

于 2011-05-17T13:14:33.233 に答える
0

このページには、JS での OOP に関する Mike Koss による優れたチュートリアルがあります。

jQuery プラグインでよく使われているのを見てきましたが、最初の括弧の後に空の括弧が続くのは何を意味し、何をするのでしょうか?

2 番目の括弧のセットは、最初の括弧のセットで宣言した関数をすぐに呼び出します。

宣言して個別に実行できます(複数回実行できます):

var myFunction = function() { alert("boo"); }; // Declare & instanciate
myFunction(); // Invoke
myFunction(); // Invoke again

または、両方を 1 行で実行します。

(function() { alert("boo"); })(); // Can only invoke now, the function is anonymous and not stored anywhere.
于 2011-05-17T12:23:59.123 に答える