Soc-Tools.Ru

Ребят, туплю уже час, не могу понять в чём дело. Есть два файла: main.js и utils.js. В utils.js объявлена функция `calculateTotal()`. Подключаю их в index.html в таком порядке:

```html
<script src="utils.js"></script>
<script src="main.js"></script>
```

Но в main.js, когда я вызываю `calculateTotal()`, браузер выдаёт ошибку, что функция не определена. Хотя вроде всё правильно сделал, подключаю же utils первым. В консоли разработчика utils.js загружается. Уже и кэш почистил, и перезагружал. Может, я чего-то очевидного не вижу?

Привет! Классика. Сам постоянно на этом спотыкаюсь. Скорее всего, твой main.js выполняется до того, как DOM полностью загрузился, и твоя функция из utils.js ещё не стала глобальной. Попробуй обернуть вызов функции в main.js в `document.addEventListener('DOMContentLoaded', function() { ... });`. Или используй defer в теге script.

Спасибо за совет! Попробовал добавить defer — не помогло. Ошибка та же. Странно, ведь utils.js должен быть первым в очереди. Может, дело в самом utils.js? Проверял, там точно нет опечаток?

А function expression вместо declaration не используешь случайно? То есть, если у тебя в utils.js не `function calculateTotal() { ... }`, а `const calculateTotal = function() { ... }` или стрелочная, то она не будет поднята (hoisted), и тогда порядок подключения критичен, даже с defer. Кидай код utils.js, без этого гадать бесполезно.

Открой вкладку Network в инструментах разработчика. Оба файла грузятся? Может, на один из них 404 ошибка? Ещё можно в самом начале main.js поставить `console.log('Main loaded')`, а в utils.js — `console.log('Utils loaded')`, чтобы увидеть реальный порядок загрузки и выполнения.

Всем спасибо! Оказалось, @NullPointerException был прав. Я использовал const с стрелочной функцией. Переделал на обычное объявление функции, и всё заработало. Надо лучше учить матчасть, да. Ещё раз всем благодарность, выручили!

Пожалуйста! Заходи ещё, если что. У всех бывают такие моменты, когда не видишь лес за деревьями.)