Одна и та же переменная объявляется дважды. Какой из них используется? - JAVASCRIPT

Question

Код ниже произведет 8 из-за того, что второе объявление переопределит первое. Ага! Имеет смысл.

Пример 1

function foo(){
    function bar() {
        return 3;
    }
    return bar();
    function bar() {
        return 8;
    }
}
console.log(foo()); // ---> 8

Следующий код производит 3 Это означает, что это первое выражение, которое вызывается.

Пример 2

function foo(){
    var bar = function() {
        return 3;
    };
    return bar();
    var bar = function() {
        return 8;
    };
}
console.log(foo()); // ---> 3

Я склоняюсь к выводу, что в JavaScript используется только первая объявленная переменная, как показано выше. Тем не менее, код ниже производит 7 (хм... почесывая голову)

Пример 3

var a = 4;
var a = 7;
console.log(a); //---> 7

В конце концов, я буду использовать let или же const (чтобы не объявлять одну и ту же переменную много раз) объявлять переменные, а не var но я пытаюсь понять, почему результаты, полученные в примерах 2 и 3, настолько непредсказуемы. Благодарю.

Answer 1

Пример 1 эквивалентен приведенному ниже коду. Вот bar отменяется до return таким образом, он оценивается с последним значением, которое ему присвоено. Подробнее о вы можете прочитать Переменные и Подъем функций.

function foo(){
    function bar() {
        return 3;
    }
    
    function bar() {
        return 8;
    }
    
    return bar(); 
}
console.log(foo()); 

Пример 2 эквивалентен приведенному ниже коду. Здесь вы можете увидеть, что bar объявляется только один раз, и ему присваивается первое значение. Второе присваивание выполняется после возврата, поэтому код не доходит до него. И return выполняется с первым заданием.

function foo(){
    var bar;
    bar = function() {
        return 3;
    };
    
    return bar();
    
    bar = function() {
        return 8;
    };
}
console.log(foo());

Как насчет примера 3, когда вы объявляете одну и ту же переменную много раз с var, позже var просто игнорируются. Ну вот так

var a = 4;
a = 7;
console.log(a);

Answer 2

Нет, просто разница в том, как вы объявляете функции.

Это как раз разница между var functionName = function() {} а также function functionName() {}

Предположим, у вас есть две функции.

var function1 = function() {

};
function function2() {

}

Разница в том, что function1 является выражением функции и поэтому определяется только при достижении этой строки.

function1();
var function1 = function() {

};

Когда компилятор достигнет этой строки, будет выдано сообщение об ошибке типа function1 не определено.

function2 является объявлением функции, и это глобально (из-за подъема).

function2();
function function2() {

}

Этот код будет вызывать function2 функция.

Итак, в вашем первом примере это так же, как function2 (есть объявление функции).

В вашем втором примере это так же, как function1 (есть выражение функции)