title: Can someone explain these function definitions and hoisting?
body: <p>Can someone please explain to me what is happening in following three examples?
  My thoughts are for the first example, <code>bar</code> is not executed (it's just a function declaration) so when <code>foo</code> is executed, the output is <code>undefined</code>? For the second example, <code>bar</code> is executed so that value 3 is returned. For the third example I don't have a clue why it produces 8.</p>
  
  <pre><code>// 1)
  function foo() {
      function bar() {
          return 3;
      }
  }
  foo(); // undefined
  
  // 2) 
  function foo() {
      function bar() {
          return 3;
      }
      return bar();
  }
  foo(); // 3
  
  // 3)
  function foo(){ 
      function bar(){
          return 3;
      }
      return bar();
      function bar() { 
           return 8;
      }
   }
   foo(); // 8
  </code></pre>