title: Why does onload function run before src is declared?
body: <p>Here's my code:</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;style&gt;
        *{ margin: 0px; padding: 0px; }
        canvas{ display: block; margin: 0px auto; border: 1px solid #000;}
      &lt;/style&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;canvas id = "game"&gt; 
      &lt;/canvas&gt;
      &lt;script&gt;
        var y = new Image();
        y.onload = alerting();
        function alerting() {
          alert("yeaaa");
        }
        var canvas = document.getElementById("game");
        var ctx = canvas.getContext("2d");
        //y.src = "Untitled.bmp";
        ctx.drawImage(y, 5, 5);
      &lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt; 
  </code></pre>
  
  <p>Two questions:</p>
  
  <ul>
  <li>Why does the .onload run before image source is declared?  I thought it should run after the .src is declared.</li>
  <li>Why can I rename <code>onload</code> to anything and it will still run?</li>
  </ul>
  
  <p>`</p>