title: optimizing code for future changes
body: <p>I am a bit new to this but one of my canvas slide shows begins with the creation of image objects whuch are later inserted into an arra.</p>
  
  <pre><code>var image0 = new Image();
      image0.src = "images/pic1.jpg";
      var image1 = new Image();
      image1.src = "images/pic2.jpg";
      var image2 = new Image();
      image2.src = "images/pic3.jpg";
      var image3 = new Image();
      image3.src = "images/pic4.jpg";
      // array of 4 images
      images = new Array(image0, image1, image2, image3);
  </code></pre>
  
  <p>however, whenever i try to put it in a "for" loop so that later on i can add pictures to it, the code crushes, any idea what the best syntax for this wil be?</p>
  
  <pre><code>    var im = new Array(x);
  
          for (var i = 1;i&lt;im.length;i++) {
              im[i] = new Image;
              im[i].src = "images/pic"+(i+1)+".jpg"
          };
  
  
  
  images = new Array(im[0], im[1], im[2], im[3]);
  </code></pre>
  
  <p>i apologize in advance if the answer is too simple and i just missed it.</p>