Как объяснить эту проблему с переменной областью?

Question

Почему вторая функция выводит пустой массив?

var global = ["abc"];

function test1() {
    var g = global || [];
    console.log(g);             //outputs: ["abc"]
}

function test2() {
    var global = global || [];
    console.log(global);        //outputs: []
}

Answer 1

Хотя кажется, что это должно работать, потому что присваивание работает справа налево, вы должны учитывать, что объявления переменных подняты .

Для интерпретатора вашкод на самом деле выглядит так:

function test2() {
    var global; // global is undefined

    global = global || []; // because undefined is falsey, the [] is assigned

    console.log(global); // displays the []
}

Answer 2

var global переопределяет символ global как локальную переменную в области действия этой функции, что делает другой global невидимым. Если вы хотите сделать то, что делает эта вторая функция, используйте другое имя:

var global = ["abc"];

function test2() {
    var local = global || [];
    console.log(local);        //outputs: ["abc"]
}

или, если исходное определение global действительно является глобальной переменной, вы можете использовать объект окна для ссылки на него, когда его обычный символ скрыт локальной переменной (хотя я бы не советовал делать это, потому что это будет скорее всего сбивают с толку людей, пытающихся понять ваш код):

var global = ["abc"];

function test2() {
    var global = window.global || [];
    console.log(global);        //outputs: ["abc"]
}

Answer 3

Причина, по которой он выводит пустое имя, состоит в том, что, как только у вас есть конфликтующие имена.Существует как локальное, так и глобальное имя global.Внутри функции, которая определяет global как локальный, все вхождения будут ссылаться на локальные.Он никогда не увидит глобального значения.

Следовательно, строка var global = global || [] интерпретирует global как локальное.Это в настоящее время undefined, следовательно, он выбирает [].

Один из способов выполнить эту работу - использовать полное имя для глобального экземпляра

function test2() {
  var global = window.global || [];
  console.log(global); // outputs ["abc"]
}