title: Passing parameters into a callback function in a loop results in all callbacks being evaluated with the final parameter value
body: <p>I am well aware that this question has been asked a million and one times, however I've tried every suggested solution, and none of them have worked.</p>
  
  <p>I think what I'm trying to do is have a callback that's a closure, but every way I try to do this either ends with the parameter in the callback being "undefined" or the callback getting called too early. </p>
  
  <pre><code>var pages = ["why", "ux", "examples", "make", "marketplace"]
  for (i = 0; i &lt; 5; i++) {
      alert("pages is" + pages[i])
      if (filesadded.indexOf("[" + pages[i] + "]") == -1) {
          function fas2(callback) {
  
              var scriptadded = document.createElement('script')
              scriptadded.setAttribute("type", "text/javascript")
              //Date.now() is added to the end of the filename so that if the main page is reloaded, the other pages will update if in cache
              scriptadded.setAttribute("src", pages[i] + ".js?" + Date.now())
  
              scriptadded.onload = callback(pages[i]);
              scriptadded.onreadystatechange = callback(pages[i]);
  
              //adds line to head
              document.getElementsByTagName("head")[0].appendChild(scriptadded)
          }
          //adds file name to list of loaded files
          filesadded += "[" + pages[i] + "]"
  
          var addPage2 = function (toSwitch) {
  
              switch (toSwitch) {
                  case "why":
                      why.addPage()
                      break;
  
              }
          }
  
          fas2(addPage2);
      }
  }
  </code></pre>
  
  <p>In the version shown above, the callback gets called too early and I get the error "Can't find variable: why." Alternatively, when I have something like <code>scriptadded.onload = function() {callback(pages[i])};</code> the callback gets called at the correct time, but toSwitch ends up being undefined</p>