In this JavaScript code, why can some functions access internal variables and others not?
<p>I have the following code:</p>

<pre><code>var dp = dp || {
    VERSION : '0.00.02',
    startApp : function() {
        $(app.init);
        $(app.start);
    }
};
dp.startApp();
</code></pre>

<p>which calls app.init and app.start below:</p>

<pre><code>var app = app || {};

app.init = function() {
    this.baseElement = $('div#app');
    $('body').css('background-color', 'beige');
};

app.start = function() {
    //this.baseElement.html('showing this'); //this works
    //this.show(); //error: show is not a function
    app.show(); //error: show is a function, but baseElement is undefined
};

app.show = function() {
    this.baseElement.html('showing this');
};
</code></pre>

<p>why in <code>app.start</code> does:</p>

<ul>
<li>the first line work</li>
<li>the second line show it is not a function</li>
<li>the third line say that baseelement is undefined</li>
</ul>
