You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: 1-js/02-first-steps/16-function-expressions/article.md
+14-14Lines changed: 14 additions & 14 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,6 @@
1
1
# Функціональні вирази
2
2
3
-
Для JavaScript функція — це не "магічна мовна структура", a значення особливого ґатунку.
3
+
Для JavaScript функція — це не "магічна мовна структура", а значення особливого ґатунку.
4
4
5
5
Синтаксис, що ми раніше використовували, називається [*Оголошення Функції*](https://developer.mozilla.org/uk/docs/Web/JavaScript/Guide/Functions#Оголошення_функції) (Function Declaration):
6
6
@@ -22,15 +22,15 @@ let sayHi = function() {
22
22
};
23
23
```
24
24
25
-
Ми бачимо змінну `sayHi`. В якості значення, їй присвоюється нова функція `function() { alert("Привіт"); }`.
25
+
Ми бачимо змінну `sayHi`. Як значення їй присвоюється нова функція `function() { alert("Привіт"); }`.
26
26
27
27
Оскільки створення функції відбувається в контексті присвоєння виразу (праворуч від `=`), це називається *Функціональним виразом* (Function Expression).
28
28
29
29
Зауважте, після ключового слова `function` немає назви функції. Для функціональних виразів це допустимо.
30
30
31
31
В цьому прикладі, ми одразу присвоюємо функцію цій змінній, тож, інакше кажучи, код в прикладі "створює функцію і кладе її в змінну `sayHi`".
32
32
33
-
В складніших ситуаціях, з якими ми стикнемося пізніше, функцію можна створити і відразу ж викликати або запланувати її на відтерміноване виконання. Такі функції ніде не зберігаються, тому вони залишаються анонімними.
33
+
В складніших ситуаціях, з якими ми стикнемося пізніше, функцію можна створити та відразу ж викликати або запланувати її на відтерміноване виконання. Такі функції ніде не зберігаються, тому вони залишаються анонімними.
34
34
35
35
## Функція -- це значення
36
36
@@ -72,7 +72,7 @@ sayHi(); // Привіт // ось так теж спрацює (а чо
72
72
Розглянемо детально, що тут відбулось:
73
73
74
74
1. Оголошення Функції `(1)` створює саму функцію і кладе її значення у змінну `sayHi`.
75
-
2. Рядок `(2)` копіює це значення в змінну `func`. Ще раз зауважте: після `sayHi` немає дужок. Якби вони там були, тоді `func = sayHi()` записав би *результат виклику*`sayHi()` у `func`,а не *саму функцію*`sayHi`.
75
+
2. Рядок `(2)` копіює це значення в змінну `func`. Ще раз зауважте: після `sayHi` немає дужок. Якби вони там були, тоді `func = sayHi()` записав би *результат виклику*`sayHi()` у `func`,а не *саму функцію*`sayHi`.
76
76
3. Тепер ми можемо викликати функцію двома шляхами: `sayHi()` або `func()`.
77
77
78
78
Також ми могли використати Функціональний Вираз у першому рядку, щоб визначити `sayHi`:
@@ -104,7 +104,7 @@ let sayHi = function() {
104
104
105
105
Відповідь проста: тут Функціональний Вираз (у вигляді `function(…) {…}`) створений всередині інструкції присвоєння: `let sayHi = …;`. Крапка з комою `;` не є частиною синтаксису функції. Вона є частиною інструкції, тому її рекомендується ставити в кінці інструкції.
106
106
107
-
Крапку з комою доцільно було б поставити і для простішої інструкції, наприклад для `let sayHi = 5;`.
107
+
Крапку з комою доцільно було б поставити й для простішої інструкції, наприклад для `let sayHi = 5;`.
108
108
````
109
109
110
110
## Колбеки (функції зворотного виклику)
@@ -144,13 +144,13 @@ function showCancel() {
144
144
ask("Ви згодні?", showOk, showCancel);
145
145
```
146
146
147
-
Такі функції є досить практичними. Головна відмінність між функцією `ask` у реальних програмах та прикладі вище, полягає в тому, що перша може використовувати більш складні способи взаємодії з користувачем, ніж звичайний `confirm`. У браузерах така функція зазвичай показує гарненьке модальне вікно з запитанням. Але це вже інша історія.
147
+
Такі функції є досить практичними. Головна відмінність між функцією `ask` у реальних програмах та прикладі вище, полягає в тому, що перша може використовувати складніші способи взаємодії з користувачем, ніж звичайний `confirm`. У браузерах така функція зазвичай показує гарненьке модальне вікно з запитанням. Але це вже інша історія.
148
148
149
149
**Аргументи `showOk` та `showCancel` функції `ask` називаються *функціями зворотного виклику* або просто *колбеками*.**
150
150
151
-
Суть полягає в тому, що ми передаємо функцію і очікуємо, що вона буде викликана (англ. "called back") пізніше, якщо це буде потрібно. У нашому випадку, `showOk` стає колбеком, якщо відповідь — "yes", а `showCancel`, якщо відповідь — "no".
151
+
Суть полягає в тому, що ми передаємо функцію та очікуємо, що вона буде викликана (англ. "called back") пізніше, якщо це буде потрібно. У нашому випадку, `showOk` стає колбеком, якщо відповідь — "yes", а `showCancel`, якщо відповідь — "no".
152
152
153
-
Ми можемо використати Функціональний Вираз, щоб записати туж саму функцію коротше:
153
+
Ми можемо використати Функціональний Вираз, щоб записати ту ж саму функцію коротше:
154
154
155
155
```js run no-beautify
156
156
functionask(question, yes, no) {
@@ -203,19 +203,19 @@ ask(
203
203
};
204
204
```
205
205
206
-
Більш тонка відмінність в тому, *коли* функція буде створена рушієм Javascript.
206
+
Тонкіша відмінність в тому, *коли* функція буде створена рушієм Javascript.
207
207
208
208
**Функціональний Вираз буде створено тільки тоді, коли до нього дійде виконання і тільки після цього він може бути використаний.**
209
209
210
-
Щойно потік виконання досягне правої частини у присвоєнні `let sum = function…`, функцію буде створено і з цього моменту її можна буде використати (присвоїти змінній, викликати тощо).
210
+
Щойно потік виконання досягне правої частини у присвоєнні `let sum = function…`, функцію буде створено і з цього моменту її можна буде використати (присвоїти змінній, викликати тощо).
211
211
212
212
У випадку з Оголошенням Функції все інакше.
213
213
214
214
**Синтаксис Оголошення Функції дозволяє викликати функцію раніше, ніж вона були визначена в коді**
215
215
216
216
Наприклад, глобальне Оголошення Функції буде доступним з будь-якого місця в скрипті.
217
217
218
-
Така поведінка спричинена особливостями внутрішніх алгоритмів. Коли JavaScript готується до виконання скрипта, він спочатку шукає всі глобальні Оголошення Функцій і на їх основі створює функції. Цей процес можна вважати "фазою ініціалізації".
218
+
Така поведінка спричинена особливостями внутрішніх алгоритмів. Коли JavaScript готується до виконання скрипту, він спочатку шукає всі глобальні Оголошення Функцій і на їх основі створює функції. Цей процес можна вважати "фазою ініціалізації".
219
219
220
220
Після того, як всі Оголошення Функцій були оброблені, рушій починає виконання коду.
221
221
@@ -231,7 +231,7 @@ function sayHi(name) {
231
231
}
232
232
```
233
233
234
-
Функцію `sayHi` було створено, коли JavaScript готувався до виконання скрипта і вона буде доступною з будь-якого місця.
234
+
Функцію `sayHi` було створено, коли JavaScript готувався до виконання скрипту і вона буде доступною з будь-якого місця.
235
235
236
236
...З Функціональним Виразом це не спрацювало б:
237
237
@@ -245,7 +245,7 @@ let sayHi = function(name) { // (*) більше ніякої магії
245
245
};
246
246
```
247
247
248
-
Створення функцій, визначених Функціональними Виразами, відбувається тоді, коли до них доходить потік виконання. Це станеться тільки при досягненні рядку з зірочкою `(*)`. Занадто пізно.
248
+
Створення функцій, визначених Функціональними Виразами, відбувається тоді, коли до них доходить потік виконання. Це станеться тільки при досягненні рядка з зірочкою `(*)`. Занадто пізно.
249
249
250
250
Ще однією особливістю Оголошення Функції є її блокова область видимості.
251
251
@@ -377,4 +377,4 @@ welcome(); // спрацює
377
377
378
378
Зазвичай, коли нам потрібно визначити функцію, то краще віддати перевагу синтаксису Оголошення Функції, бо така функція є видимою навіть перед її визначенням в коді. Це дає нам більшу гнучкість в організації коду та й сам синтаксис є більш читабельним.
379
379
380
-
Таким чином, використовувати Функціональний Вираз потрібно тільки тоді, коли Оголошенням Функції не підходить для вирішення нашої задачі. Ми розглянули декілька таких прикладів у цьому розділі і побачимо ще в майбутньому.
380
+
Таким чином, використовувати Функціональний Вираз потрібно тільки тоді, коли Оголошенням Функції не підходить для розв'язання нашої задачі. Ми розглянули декілька таких прикладів у цьому розділі й побачимо ще в майбутньому.
0 commit comments