diff --git a/1-js/02-first-steps/15-function-basics/article.md b/1-js/02-first-steps/15-function-basics/article.md index dfe0fbd14..a4f979e86 100644 --- a/1-js/02-first-steps/15-function-basics/article.md +++ b/1-js/02-first-steps/15-function-basics/article.md @@ -20,7 +20,7 @@ function showMessage() { } ``` -Спочатку ми пишемо `function` — це ключове слово (keyword), яке дає зрозуміти комп’ютеру, що далі буде оголошення функції. Потім — *назву функції* та список її *параметрів* в дужках (розділені комою). Якщо параметрів немає, ми залишаємо *пусті дужки*. І нарешті, код функції, який також називають *тілом функції* між фігурними дужками. +Спочатку ми пишемо `function` — це ключове слово (англ. keyword), яке дає зрозуміти комп’ютеру, що далі буде оголошення функції. Потім — *назву функції* та в дужках список з назвами *параметрів* які наша функція має приймати (розділяючи їх комою). Якщо ми не хочемо щоб наша функція приймала параметри, ми залишаємо *пусті дужки*. І нарешті, код функції, який також називають *тілом функції* між фігурними дужками. ```js function name(parameter1, parameter2, ... parameterN) { @@ -71,7 +71,7 @@ alert( message ); // <-- Помилка! Змінна недоступна по ## Зовнішні змінні -Функція може використовувати зовнішні змінні, наприклад: +Функція може використовувати змінні, які оголошені за її межами (зовнішні змінні), наприклад: ```js run no-beautify let *!*userName*/!* = 'Іван'; @@ -184,7 +184,7 @@ alert( from ); // Анна Дехто може сказати, що в прикладі вище "функцію `showMessage` оголошено з двома параметрами, потім викликано з двома аргументами: `from` і `"Привіт"`". -## Типові значення +## Значення за замовчуванням Якщо викликати функцію без аргументів, тоді відповідні значення стануть `undefined`. @@ -196,7 +196,7 @@ showMessage('Анна'); Помилки не виникне. Такий виклик виведе `"*Анна*: undefined"`. Оскільки значення для змінної `text` не задане, воно стане `undefined`. -Ми можемо задати так зване "типове" значення параметра, яке використовуватиметься, якщо не задати аргумент. Для цього потрібно написати значення через `=`: +Ми можемо задати для параметра значення за замовчуванням, яке використовуватиметься, якщо не задати аргумент. Для цього потрібно написати значення через `=`: ```js run function showMessage(from, *!*text = "текст не задано"*/!*) { @@ -208,7 +208,7 @@ showMessage("Анна"); // Анна: текст не задано Тепер, якщо параметр `text` не задано, його значення стане `"текст не задано"`. -Типове значення також додається, якщо параметр існує, але суворо дорівнює `undefined`, наприклад: +Значення за замовчуванням також застосовується, якщо параметр існує, але суворо дорівнює `undefined`, наприклад: ```js showMessage("Анна", undefined); // Анна: текст не задано @@ -224,7 +224,7 @@ function showMessage(from, text = anotherFunction()) { ``` ```smart header="Обчислення типових параметрів" -В JavaScript, типовий параметр обчислюється кожного разу, коли викликається функція без відповідного параметру. +В JavaScript, типовий параметр обчислюється не один раз при оголошенні функції, а кожного разу, коли функція викликається без відповідного параметра. В прикладі вище, функція `anotherFunction()` не викличеться, якщо буде задано параметр `text`. @@ -232,7 +232,7 @@ function showMessage(from, text = anotherFunction()) { ``` ````smart header="Типові параметри у старому JavaScript коді" -Кілька років тому JavaScript не підтримував синтаксис типових значень для параметрів. Тому люди використовували інші способи їх визначення. +Кілька років тому JavaScript не підтримував синтаксис значень за замовчуванням для параметрів. Тому люди використовували інші способи їх визначення. Нині ми можемо зустріти їх у старих скриптах. @@ -254,8 +254,8 @@ function showMessage(from, text) { ```js function showMessage(from, text) { - // Якщо значення у змінній text дає false, призначається типове значення - // це передбачає, що text == "" це те саме, що і його повна відсутність + // Якщо значення у змінній text при перетворенні на булевий тип буде false, їй призначається значення за замовчуванням + // в цій ситуації скрипт сприймає `""` як те саме, що і його повна відсутність. text = text || 'текст повідомлення відсутній'; ... } @@ -263,9 +263,9 @@ function showMessage(from, text) { ```` -### Альтернативні типові параметри +### Альтернативні параметри за замовчуванням -Інколи виникає необхідність присвоїти типові значення для змінних під час виконання функції, а не під час її оголошення. +Інколи виникає необхідність присвоїти значення за замовчуванням для змінних під час виконання функції, а не під час її оголошення. Під час виконання функції, ми можемо перевірити, чи параметр надано, порівнюючи його з `undefined`: @@ -295,7 +295,7 @@ function showMessage(text) { } ``` -Сучасні рушії JavaScript підтримують [оператор null-злиття](info:nullish-coalescing-operator) `??`. Його краще використовувати, коли "майже false" значення, типу `0`, мають вважатися за "нормальні": +Сучасні рушії JavaScript підтримують [оператор об’єднання з null](info:nullish-coalescing-operator) `??`. Його краще використовувати, коли "майже false" значення, типу `0` або `""`, мають вважатися за "нормальні": ```js run function showCount(count) { @@ -310,7 +310,7 @@ showCount(); // невідомо ## Повернення значення -Як результат функція може повертати назад значення в код, який викликав цю функцію. +Функція може повертати значення в код, який викликав цю функцію. Найпростіший приклад — функція, яка сумує два значення: @@ -323,7 +323,7 @@ let result = sum(1, 2); alert( result ); // 3 ``` -Директива `return` може бути в будь-якому місці функції. Коли виконання досягає цієї директиви, функція зупиняється, і в код, який викликав цю функцію, повертається значення (в прикладі вище, це значення надається змінній `result`). +Директива `return` може бути в будь-якому місці функції. Коли виконання досягає цієї директиви, функція зупиняється, і в код, який викликав цю функцію, повертається значення (в прикладі вище, це значення присвоюється в змінну `result`). В одній функції може бути декілька директив `return`. Наприклад: @@ -368,13 +368,13 @@ function showMovie(age) { В коді вище, якщо `checkAge(age)` поверне `false`, тоді функція `showMovie` не дійде до виконання `alert`. -````smart header="Функція з порожнім `return`, або без `return` повертає `undefined`" -Якщо функція не повертає значення, тоді "повернене" значення буде `undefined`: +````smart header="Функція з порожнім `return`, або без вказаного в ній `return` повертає `undefined`" +Функція буде повертати значення навіть якщо ви не вкажете їй явно що вона повинна повертати. Просто значення це буде `undefined`: ```js run function doNothing() { /* порожньо */ } -alert( doNothing() === undefined ); // true +alert( doNothing() ); // undefined ``` Порожній `return` це те саме, що `return undefined`: @@ -402,7 +402,7 @@ return*!*;*/!* ('деякий' + 'довгий' + 'вираз' + 'або' + 'що' * f(a) + f(b)) ``` -Тобто, повернеться порожній результат. +Тобто, результат буде як ніби ми взагалі не вказали ніякого виразу після `return`. Якщо ми хочемо повернути довгий вираз, який займе декілька рядків, ми повинні писати його на одному рядку з `return`. Або обгорнути його в дужки. Ось так: @@ -413,7 +413,7 @@ return ( 'що' * f(a) + f(b) ) ``` -Такий варіант працюватиме так, як ми задумали. +От такий варіант працюватиме так, як ми задумали. ```` ## Найменування функції [#function-naming] @@ -438,7 +438,7 @@ showMessage(..) // показує повідомлення getAge(..) // повертає вік (якось його отримує або обчислює) calcSum(..) // обчислює суму і повертає результат createForm(..) // створює форму (і зазвичай її повертає) -checkPermission(..) // перевіряє доступ, повертає true/false +checkPermission(..) // перевіряє дозвіл, повертає true/false ``` Якщо є префікси, погляд на ім’я функції дає зрозуміти, яку роботу вона виконує і яке значення повертає. @@ -508,7 +508,7 @@ function isPrime(n) { } ``` -Другий варіант легше зрозуміти, чи не так? Замість частини коду ми бачимо назву дії (`isPrime`). Іноді розробники називають такий код *само документованим*. +Другий варіант легше зрозуміти, чи не так? Замість частини коду ми бачимо назву дії (`isPrime`). Іноді розробники називають такий код *самодокументованим*. Отже, функції можна створювати, навіть якщо ми не маємо наміру повторно їх використовувати. Вони структурують код і роблять його читабельним та зрозумілим. @@ -524,7 +524,7 @@ function ім’я(параметри, розділені, комою) { - Значення, які передаються в функцію як параметри, копіюються в локальні змінні. - Функції мають доступ до зовнішніх змінних. Але це працює тільки зсередини назовні. Код поза функцією не має доступу до локальних змінних функції. -- Функція може повертати значення. Якщо цього не відбувається, результат буде `undefined`. +- Функція завжди повертає значення. Якщо не вказати яке саме, то повертатиме `undefined`. Для того, щоб зробити код чистим і зрозумілим, рекомендується використовувати локальні змінні та параметри функції, не користуватися зовнішніми змінними. @@ -533,7 +533,7 @@ function ім’я(параметри, розділені, комою) { Найменування функцій: - Ім’я функції повинне бути коротким і чітко відображати, що робить функція. Побачивши виклик функції в коді, ви повинні зразу зрозуміти, що функція робить, і що повертає. -- Функція -- це дія, тому її ім’я зазвичай складається з дієслова. +- Функція -- це дія, тому її ім’я зазвичай починається з дієслова. - Є багато загальноприйнятих префіксів, такі як `create…`, `show…`, `get…`, `check…` тощо. Використовуйте їх, щоб пояснити, що робить функція. Функції -- це основні будівельні блоки скриптів. Ми розглянули лише основи функцій в JavaScript, проте вже зараз цього достатньо, щоб почати їх створювати та використовувати. Це лише початок шляху. Ми будемо неодноразово повертатися до функцій і аналізуватимемо їх все глибше і глибше.