2011-07-02 4 views
1

私はthis really coolに関連するコードで遊んでいます。次の関数呼び出しは、JavaScriptでどのように動作しますか

var messageFactory = (function() { 
    var that = {}, 
     $chatMessage = $('<p></p>'). 
      addClass('chat message'), 
     $nick = $('<span></span>'). 
      addClass('nick'), 
     $systemMessage = $('<p></p>'). 
      addClass('system message'); 

    var chat = function(message) { 
     var $filledNick = $nick.clone(). 
      text(message.nick + ':'); 
     return $chatMessage.clone(). 
     append($filledNick). 
     append(message.text); 
    }; 

    var system = function(message) { 
     return $systemMessage.clone().text(message.text); 
    }; 

    that.chat = chat; 
    that.system = system; 

    return that; 
    })(); 

その後のサブ機能は、何が起こっている以下、

messageFactory.system({ text: 'You changed your nick to ' + nick + '.'}) 

messageFactory.chat({ nick: 'me', text: message }) 

のように呼ばれている次のように変数は機能が割り当てられている記事コードで

その通話では?具体的には、var messageFactoryはC#のような言語のクラス定義に似た働きをしていますが、スコープに関連するメカニズムがオブジェクト{text: '...' ...}を介してどのように渡されているかについて、 。

ありがとうございます!

答えて

0

最初に注意すると、おそらく最も重要なことは、最後の行であるのです。具体的には;より前の()です。これは、行1の匿名関数をただちに実行することです。messageFactoryには匿名関数が含まれていないので、それから返されるものは何でも、注意することが重要です。よりよいことを理解するために、私は例をあげる...心に留めておくべき

var x = (function(){ return "Hello!"; })(); 
// x will contain "Hello!", not the function. 

2つ目は、JavaScriptでのオブジェクトは、それらが作成されたクロージャへの参照を維持することである。もしそうであれば、直ちに上でやっているような関数を実行すると、フォームがクロージャになり、そのクロージャで作成されたオブジェクトは、関数が実行された後でもそのオブジェクトへの参照を保持します。もう1つの例....

var sayHi = (function(){ 
    var salutation = "Hello"; 
    return function(name) { 
     return salutation + ", " + name + "."; 
    } 
})(); 

もう一度、匿名機能がすぐに実行されることに注意してください。変数sayHiには、外部の無名関数は含まれず、戻り値が含まれます。したがって、sayHiには実際にはfunction(name){ return salutation + ", " + name + ".";}が含まれます。あなたは私たちがsalutationに渡していないことに注意しますが、それは、この機能で作成したclosureの一部だとして、我々はまだそれにアクセスすることができます。

最終的なものを提供するコードがあることを理解するために、JavaScriptで、{}ことObjectリテラルです。基本的にはnew Object()と言っても同じです。これらのオブジェクトは、C#オブジェクトと同じプロパティとメソッドを持つことができます。これは、参照先のオブジェクトから.textが取得された場所です。

2行目で、コードはObjectリテラル:var that = {}を作成しています。次のvarの作成はvar chat = function(message){....で、messageパラメータをとり、それに何らかの処理を行う関数が作成されます。コードの終わりに向かって、chat関数はchatプロパティに割り当てられ、thatに割り当てられ、次にthatが返されます。that.chat = chatreturn that

この点の中で、messageFactoryには、割り当てられているように見える機能は含まれていませんが、その機能のreturnが含まれています。この場合、その戻り値は実際にthatオブジェクトです。このオブジェクトは、chatsystemという2つのプロパティを持ちます。これらのプロパティは、thatが作成された同じクロージャ内の変数chatsystemの変数を実際に指しています。

あなたが実際に閉鎖内部chat関数へのパラメータとしてObjectを渡しているジョー})messageFactory.chat({ text: 'something', nick:を呼び出したときに最後のピースが....十分に簡単です。オブジェクトのnicktextプロパティを参照して結果を返します。

希望に役立ちます。私はそれをとてもうまく説明したのかどうかはわかりませんが、それは私の頭の中でどのように機能するのかです。

+1

このような詳細な対応に時間をとってくれてありがとう!それは本当に私のためにそれをクリアした。 – Evan

+0

これは明確なことを助けてくれてうれしい! :) – WesleyJohnson

関連する問題