Почему скрипты знают друг о друге?

Question

[justifycontent]

У меня есть 4 js файла, и каждый файл все знает про остальных, т.е. переменная, объявленная в auth.js будет видна в menu.js, так и должно быть? А когда я хочу создать переменную и дать ей имя, которое используется в другом скрипте, то мне выдает, что она уже объявлена, почему каждый скрипт знает все про другие?

Comments

[Steppp]

Да, так и должно быть) Используй ооп, функции)

допустим в файле делай конструкцию

const Auth = {
  a: 1,
  b: 2,
}
console.log(Auth.a)

или

const Auth = () => {
  const a = 1;
}

[justifycontent]

Спасибо

Answer 1

[Rsa97]

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

Answer 2

[mletov]

Почитайте про замыкания, iife, модули и области видимости.

Если вы в этих скриптах ничего не делали специально, чтобы эту область видимости ограничить, то почему бы им друг друга и не видеть, это дефолтное поведение.

И это логично, иначе как бы подключались различные библиотеки, тот же jquery, например

Answer 3

[Александр]

Потому что все скрипты выполняются в глобальной области видимости - window. Хотите ограничить область видимости каждого скрипта, тогда либо IIFE, либо паттерн "модуль" (что по сути тоже IIFE).

Answer 4

[Сергей Соколов]

Допустим, подключены два файла:

// auth.js
var myAuth = "secret";

// logic.js
function logic() {
 console.log(myAuth);
}

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

<script>
var myAuth = "secret";
function logic() {
 console.log(myAuth);
}
</script>

Поэтому все друг друга видят, слышат и дружат )
Просто размещение кода в отдельном файле не изолирует его код от прочего.

Распространённая практика во время разработки держать код по разным файлам, логически разделяя. А для продакшн собирать весь код в один файл (или несколько, чтобы куски сборки сделать полегче).

Comments

[justifycontent]

Понял, спасибо большое за такой подробный ответ! Успехов вам!