Как происходит всплытие переменной?

//var a;
function c() {
  a = 7;
}
c();
console.log(a); //--> 7

//var a;
a;
a = 10;
console.log(a); //a is not defined

function bar() {
  a = 17;
}
bar();

console.log(window.a) // выведет 17

a; // вот эта строка вызывает ошибку: пытаемся использовать что-то несуществующее
a = 10;
console.log(a); // тут уже всё ок, выводится 10

Так вот, когда без объявления обращаются к переменной, фактически используется свойство этого верхнего объекта (window).

var foo = 1; 
function bar() { 
    //var foo;
    if (!foo) { 
        var foo = 10; 
    } 
    console.log(foo); 
} 
bar();

function bar() {
  var foo;
  // ...
  foo = 10; // свой, местный foo 
}

var foo; // внешний
function bar() {
  foo = 10; // внешний назначился
}

function bar() {
  function zee() {
    foo = 10;
  }
}

function bar() {
  
  function zee() {
    foo = 10;
  }

  var foo; // всплывёт в начало ф-ии bar
}