5

私は数週間フレームワーク開発を研究してきましたが、lib開発の世界で強く提案され、プレッシャーをかけられているもの、つまり無名関数をすぐに呼び出すものに出くわしました。

私はそれを機能させることができず、その背後にある使用法とロジックを詳細に説明するリソースを見つけることができませんでした。

これが私がこれまでに知っていることです：

  • それはすぐに呼び出します-それはすべてを匿名で、すぐに実行します。
  • 匿名です-名前が付いていないため、内部のコードは外部コードから「到達可能」ではありません。
  • グローバルウィンドウ、オブジェクト、および未定義のパラメーターを渡すことができます-それについて私が知っていることはこれだけですが、それらを完全には理解していません。

詳細なリソースだけでなく、その背後にあるロジックを説明するリソースも探しています。私はそれが非常に非論理的だと思うからです。

これが私が持っているものです：

(function( window, document, undefined ) {
    window.myThingy = myThingy;

    var myThingy = function() {
    };

    myThingy.prototype = {
        constructor: myThingy,
        create: function( elementToBeCreated ) {
            return document.createElement( elementToBeCreated );
        }
    };

})( window, document );

それで、

myThingy().create("div");

しかし、それはまだmyThingy() [object]機能ではないと言っています。

私は何が間違っているのですか？myThingy = function()グローバルオブジェクトを作成するだけでなく、すぐに呼び出す関数を使用する必要があるのはなぜですか？なぜ使用する必要があるのwindowですか？

これについてはネット上にいくつかのリソースがあることは知っていますが、どれも理解できません。それらのいくつかは詳細に中途半端になり、いくつかは詳細にしようとしますが、重要なことを説明できません。フレームワークを開発するときに、なぜこれがそれほど強調されるのですか？

心配しないでください。私は「車輪の再発明」を試みているのではありませんが、あらかじめパッケージ化されているものだけでなく、実際にJavaScriptを学習しようとしています。

良い答えには次のものが含まれている必要があります。

  • 匿名関数をすぐに呼び出す背後にあるロジックを説明する優れたリソース
  • そのリンクへの洞察
  • 私が提供したコードで間違っていること
4

2 に答える 2

4

まず、関数をグローバルオブジェクトに割り当てようとしたときに、関数がまだ定義されていないため、定義されていません。

window.myThingy = myThingy;
console.log(myThingy);//undefined

myThingy定義された後に割り当てを行う必要があります。

(function( window, document, undefined ) {


 var myThingy = function() {
 };

 myThingy.prototype = {
    constructor: myThingy,
    create: function( elementToBeCreated ) {
        return document.createElement( elementToBeCreated );
    }
 };

 window.myThingy = myThingy;

})( window, document );

さて、次に、あなたは使用できません

myThingy.create("div");

myThingyは関数であり、オブジェクトではないためです。関数オブジェクトは、newキーワードが関数に発行されたときに作成されます。この変更を行って、関数を関数オブジェクトに変換できます。

window.myThingy = new myThingy();//create a function object

このパターンは、すべてのフレームワークが実装される方法ではありませんが、類似しています。時にはもっと抽象化があります。ただし、これらの変更を行うと、アプローチが機能するようになります。

これがあなたのコードのデモです：http：//jsfiddle.net/ZjRJW/

リンク

これが私のお気に入りのいくつかです：

http://ejohn.org/blog/simple-class-instantiation/

http://ejohn.org/apps/learn/

http://ejohn.org/blog/simple-javascript-inheritance/

http://jibbering.com/faq/notes/closures/

https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Details_of_the_Object_Model

http://javascript.crockford.com/prototypal.html

于 2013-01-25T20:29:16.450 に答える
2

JSのデザインパターンについて知りたい場合は、AddyOsmaniの本/記事を強くお勧めします。彼は物事を非常にシンプルに保ち、通常、理解を助けるためにかなりのサンプルコードを提供します。コードとデザインパターンの実装に関する限り、それはコードに何をさせたいか、そしてコード/オブジェクトをどのように動作させたいかによって異なります。コーディングを開始する前に要件/目標を理解することは非常に重要です。そうすれば、特定の問題を実際に解決していないパターンのスパゲッティに迷うことはありません。

場合によっては、複雑で大規模なアプリケーションを対象としたパターンを実装することは、単にやり過ぎです。

他の誰かがあなたのコードの問題をすでに正しく指摘しているので、私はそれをそのままにしておきます。

于 2013-01-25T20:34:24.007 に答える