title: How to create multiple instances of IIFE Javascript module?
body: <p>I'm dealing with a huge javascript codebase that I'm trying to reorganize. I'm not really an expert and I just started studying good javascript coding practices. So, one thing I'm trying to do is to divide all the code in modules. In this particular case I'm trying to create a module that would help me to optimize video embeds. I would like to pass the module an id and receive some html code or an image out of it.</p>
  
  <p>I'm not putting the whole code here, but it's enough for the example:</p>
  
  <pre><code>var videoIframe = (function($) {
      'use strict';
       var id,
  
      setVideoId = function(videoId) {
          id = videoId;
          console.log(id);
      },
      getVideoThumbnail = function(videoId) {
          setVideoId(videoId);
  
      },
      test = function() {
          console.log(id)
      },
      getVideoEmbedCode = function() {
  
      };
  
      return {
         test: test,
         getVideoThumbnail: getVideoThumbnail
      };
  })(jQuery);
  </code></pre>
  
  <p>In another module I assign it to two variables:</p>
  
  <pre><code>    var video1 = videoIframe;
      var video2 = videoIframe;
  
      video1.getVideoThumbnail(123);
      video2.getVideoThumbnail(456);
  
      video1.test();
      video2.test();
  </code></pre>
  
  <p>And, of course, I'm not getting what I expected. After the second <code>getVideoThumbnail</code> call, it always prints <code>456</code>.</p>
  
  <p>Doing some research I understood that I'm creating a singleton, a single instance, and I'm only changing values inside that instance. I think I need a constructor for my module, but I'm not sure how to create it in combination with the IIFE pattern. And is it the right approach?</p>