title: Passing object to the function JS
body: <p>How do I pass object as a variable to the function in this scenario? I'm getting console.log(setup) = undefined? Is there any better way to pass callback function to getTemplate() ? Thanks </p>
  
  <p>Function Template</p>
  
  <pre><code>function getTemplate (name, callback, dir) {
            if (dir === undefined) dir = ''
            var xhr = new XMLHttpRequest()
            var url = '/core/templates/' + dir + name + '.html'
            xhr.open('GET', url, true)
            xhr.onreadystatechange = function () {
              if (xhr.readyState == 4 &amp;&amp; xhr.status == 200) {
                var raw = xhr.responseText
                var compiled = Handlebars.compile(raw)
                callback(compiled)
              }
            }
            xhr.send()
          }
  </code></pre>
  
  <p>Calling Function</p>
  
  <pre><code>for (var i = 0; i &lt; item.length; i++) {
   var tabActive = ''
   if (i == 0) { tabActive = 'active' }
  
   var tab = item[i],
   tabId = tab.id,
   tabTitle = tab.title,
   variables = {tabActive: tabActive, tabId: tab.id, tabTitle: tab.title}
  
   console.log(variables) // *A increments 5328, 5329
  
   getTemplate('tab-nav', function (tmp) {
  
   console.log(variables) // *B increments 5328, 5328
  
   $(tabNavigationId + '&gt;ul').append(tmp(variables))
  
   })
  
  }
  </code></pre>
  
  <p>*A</p>
  
  <pre><code>index.js:18 Object {tabActive: "active", tabId: "5327", tabTitle: "User Experience"}
  index.js:18 Object {tabActive: "", tabId: "5328", tabTitle: "Design"}
  index.js:18 Object {tabActive: "", tabId: "5329", tabTitle: "Web Development"}
  index.js:18 Object {tabActive: "", tabId: "5330", tabTitle: "Mobile Development"}
  </code></pre>
  
  <p>*B</p>
  
  <pre><code>index.js:21 Object {tabActive: "", tabId: "5743", tabTitle: "Extension Settings"}
  index.js:21 Object {tabActive: "", tabId: "5743", tabTitle: "Extension Settings"}
  index.js:21 Object {tabActive: "", tabId: "5743", tabTitle: "Extension Settings"}
  index.js:21 Object {tabActive: "", tabId: "5743", tabTitle: "Extension Settings"}
  </code></pre>
  
  <p>Callback from getTemplate 'tmp'</p>
  
  <pre><code>function ret(context, execOptions) {
          if (!compiled) {
            compiled = compileInput();
          }
          return compiled.call(this, context, execOptions);
        }
  </code></pre>