title: Why is script ordering important when assigning a function to window.onload?
body: <p>I have a website with three files:</p>
  
  <p><strong>index.html</strong></p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script src="First.js"&gt;&lt;/script&gt;
  &lt;script src="Second.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;&lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>First.js</strong></p>
  
  <pre><code>window.onload = Main;
  </code></pre>
  
  <p><strong>Second.js</strong></p>
  
  <pre><code>function Main() { var foo = 1; }
  </code></pre>
  
  <p>When I open the page, I expect the variable 'foo' to be set to '1'.  Instead, when I open the page, it breaks indicating <em>'Main is not defined'</em> and 'Main()' is never called.</p>
  
  <p>If the '.onload' event for the window isn't supposed to fire until the page is fully loaded and thus assumingly both scripts have been loaded, why doesn't the window object have a reference to the 'Main()' method in 'Second.js'?  Should 'Main()' be a globally accessible function?</p>
  
  <p>NOTE:  I realize I can change the order in which I load the scripts and then my code would work, but that's not the purpose of my question.  What I really want to do is validate my assumption.</p>