Область видимости переменных

Внутри функции можно создавать переменные через let и const, как и везде. Но такая переменная существует только внутри функции: она создаётся, когда функция выполняется, и исчезает, когда функция заканчивается. Снаружи JavaScript её не знает:

function greet() {
    const message = "Привет!";
    console.log(message);
}

greet();
console.log(message);

Это выведет Привет!, а затем завершится ошибкой ReferenceError: message is not defined. Вызов greet() сработал, но последняя строка ищет message вне функции, где её нет. С параметрами то же самое: они существуют только внутри своей функции.

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

const shopName = "Зоолавка";

function printLabel(product) {
    console.log(`${shopName}: ${product}`);
}

printLabel("корм для собак");

Это выведет:

Зоолавка: корм для собак

Чем полезно то, что локальные переменные остаются внутри своих функций?

• Функции не мешают друг другу. В двух функциях может быть по переменной total, и это две разные переменные: изменение одной не меняет другую.
• Чтобы пользоваться функцией, нужно знать только, что ей давать (аргументы) и что она возвращает (возвращаемое значение). Как она устроена внутри — её личное дело.
• Каждый вызов начинается с чистого листа: переменные функции создаются заново, и от предыдущего вызова ничего не остаётся.

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

Кстати, то же правило действует для любого блока в фигурных скобках: переменная, созданная через let или const внутри if или цикла, существует только в этом блоке.