Skip to content

review: 01-callbacks #748

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
May 16, 2025
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 10 additions & 2 deletions 1-js/11-async/01-callbacks/article.md
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ newFunction(); // немає такої функції!
*/!*
```

Природно, браузер, ймовірно, не встиг завантажити скрипт. На даний момент функція `loadScript` не надає можливості відстежувати завершення завантаження. Скрипт просто завантажується та зрештою запускається, це й все. Але ми хотіли б знати коли це станеться, щоб могти після цього використовувати нові функції та змінні з цього скрипту.
Природно, браузер, ймовірно, не встиг завантажити скрипт. Зараз функція `loadScript` не надає можливості відстежувати завершення завантаження. Скрипт просто завантажується та зрештою запускається, це й все. Але ми хотіли б знати коли це станеться, щоб могти після цього використовувати нові функції та змінні з цього скрипту.

Додаймо `callback`-функцію як другий аргумент до `loadScript`, яка має виконуватися, коли скрипт завантажується:

Expand Down Expand Up @@ -230,10 +230,18 @@ loadScript('1.js', function(error, script) {
});
```

У коді вище:

1. Завантажуємо `1.js`, продовжуємо, якщо немає помилки...
2. Завантажуємо `2.js`, продовжуємо, якщо немає помилки...
3. Ми завантажуємо `3.js`, продовжуємо, якщо немає помилки -- робимо щось інше `(*)`.

З кожним послідовним колбеком, код стає більш вкладеним і його дедалі важче підтримувати, особливо якщо у нас справжній код замість `...`, який може включати більше циклів, умовних операторів тощо.

Це іноді називають "callback hell" (з англ. колбек-пеклом) або "pyramid of doom" (з англ. пекельною пірамідою).

<!--
loadScript('1.js', function(error, script) {
if (error) {
handleError(error);
} else {
Expand Down Expand Up @@ -298,7 +306,7 @@ function step3(error, script) {

Це працює, але код виглядає розірваним на частини. Його важко читати, і ви, напевно, помітили, що під час читання потрібно стрибати між частинами. Це незручно, особливо якщо читач не знайомий з кодом і не знає, що за чим слідує.

Крім того, всі функції під назвою `step*` призначені для одноразового використання, вони створені лише для того, щоб уникнути "пекельної піраміди". Ніхто не збирається використовувати їх повторно за межами ланцюжка дій. Таким чином, тут є деяке нагромадження в просторі імен.
Крім того, всі функції під назвою `step*` призначені для одноразового використання, вони створені лише для того, щоб уникнути "пекельної піраміди". Ніхто не збирається використовувати їх повторно за межами ланцюжка дій. Таким чином, тут є деяке нагромадження у просторі імен.

Ми б хотіли мати щось краще.

Expand Down