The scope of "this"
<p>I have a simple object and I don't understand the concept(scope) of <code>this</code> by calling the functions of this object.</p>

<p>Why in the last variant (3) calling <code>show()</code> (with the function <code>show()</code> inside object without parent) the result is "This is global" and not the inside variable <code>title("Color Picker")</code>? </p>

<p>I have the vague idea that calling the function <code>popup.show()</code> after the gloabal variable <code>show</code> is defined, <code>this</code> refers to the global object. Is this the logic explanation?</p>

<p>The code: <a href="http://jsbin.com/otuzac/1/edit" rel="nofollow">http://jsbin.com/otuzac/1/edit</a>.</p>

<pre><code>    var title="'This' is global";
        var popup={
            dom_element:("#popup"),
            title      :"Color Picker",
            prev_color :'#fff',
            set_color  : function(color){
                color=color || this.prev_color;
                //set the color
                return color;
            },
            show       :function(){
                    return("showing  "+this.title);
                    }       
        };

        var show=popup.show();


   //Case 1: var show=popup.show()
   alert(show);  //output "Color Picker"

   //Case 2: var show=popup.show()
   alert(popup.show());  //output "Color Picker"

   //Case 3: var show=popup.show !!! (no parent.)
   alert(show());  //output "This is global"
</code></pre>
