title: var single binding v/s let multiple bindings
body: <p>In the example below, I have heard that <code>var</code> creates single binding for the variable, while <code>let</code> creates a new binding for each iteration. I wanted to understand in-depth what exactly does it mean and how it works internally?</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>//var
  const arr = [];
  
  for (var i=0; i&lt;3; i++) {
    arr.push(function(){
      return i;
    })
  }
  
  console.log(arr.map(function(x){
    return x();
  }));</code></pre>
  </div>
  </div>
  </p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>//let
  const arr = [];
  
  for (let i=0; i&lt;3; i++) {
    arr.push(function(){
      return i;
    })
  }
  
  console.log(arr.map(function(x){
    return x();
  }))</code></pre>
  </div>
  </div>
  </p>