Jul 13, 2021 · Nov 6, 2020 · Dec 28, 2020 · Jul 13, 2021 · Jul 13, 2021 · Jul 13, 2021
diff --git a/1-js/02-first-steps/15-function-basics/article.md b/1-js/02-first-steps/15-function-basics/article.md
 #Functions
 #Функції

 Quite often we need to perform a similar action in many places of the script.
 Досить часто нам потрібно виконати подібну дію в багатьох місцях скрипту.

 For example, we need to show a nice-looking message when a visitor logs in, logs out and maybe somewhere else.
 Наприклад, нам треба показати приємне повідомлення, коли користувач входить або виходить з системи і може ще десь.

 Functions are the main "building blocks" of the program. They allow the code to be called many times without repetition.
 Функції — це головні "будівельні блоки" програми. Вони дозволяють робити ті самі дії багато разів в коді без повторення.

 We've already seen examples of built-in functions, like `alert(message)`, `prompt(message, default)`and `confirm(question)`.But we can create functions of our own as well.
 Ми вже стикались з такими вбудованими функціями, як-от `alert(message)`, `prompt(message, default)`та `confirm(question)`.Але ми теж можемо створювати свої функції.

 ##Function Declaration
 ##Оголошення (декларація) функцій

 To create a function we can use a *function declaration*.
 Щоб створити функцію нам треба її _оголосити_.

 It looks like this:
 Це виглядає ось так:

 ```js
 function showMessage() {
  alert( 'Hello everyone!');
  alert('Всім привіт!');
 }
 ```

 The`function` keyword goes first, then goes the *name of the function*, then a list of *parameters* between the parentheses (comma-separated, empty in the example above, we'll see examples later) and finally the code of the function, also named "the function body", between curly braces.
 Спочатку ми пишемо`function`— це ключове слово (keyword), яке дає зрозуміти комп’ютеру, що далі буде оголошення функції. Потім — *назву функції*, тоді список її *параметрів* в дужках (розділені комою). Якщо параметрів немає, ми залишаємо _пусті дужки_. І нарешті, код функції, який також називають *тілом функції* між фігурними дужками.

 ```js
 function name(parameter1, parameter2, ... parameterN) {
  ...body...
  ...тіло функції...
 }
 ```

 Our new function can be called by its name: `showMessage()`.
 Нашу нову функцію можна викликати, написавши її ім’я і дужки: `showMessage()`.

 For instance:
 Наприклад:

 ```js run
 function showMessage() {
  alert( 'Hello everyone!' );
  alert( 'Шановні друзі!' );
 }

 *!*
 */!*
 ```

 The call`showMessage()`executes the code of the function. Here we will see the message two times.
 Виклик`showMessage()`виконує код із тіла функції. В цьому випадку, ми побачимо повідомлення двічі.

 This example clearly demonstrates one of the main purposes of functions: to avoid code duplication.
 Цей приклад яскраво демонструє одну з найголовніших цілей функції - уникнення повторення коду.

 If we ever need to change the message or the way it is shown, it's enough to modify the code in one place: the function which outputs it.
 Якщо нам потрібно змінити повідомлення, достатньо змінити тіло функції, яке виводить це повідомлення.

 ##Local variables
 ##Локальні змінні

 A variable declared inside a function is only visible inside that function.
 Змінна, яка оголошена в функції доступна лише в тілі цієї функції.

 For example:
 До прикладу:

 ```js run
 function showMessage() {
 *!*
  let message = "Hello, I'm JavaScript!"; //local variable
  let message = "Бажаю вам 36.6"; //локальна змінна
 */!*

  alert( message );
 }

 showMessage(); //Hello, I'm JavaScript!
 showMessage(); //Бажаю вам 36.6

 alert( message ); // <--Error! The variable is local to the function
 alert( message ); // <--Помилка! Змінна недоступна поза функцією
 ```

 ##Outer variables
 ##Зовнішні змінні

 A function can access an outer variable as well, for example:
 Функція може використовувати зовнішні змінні, наприклад:

 ```js run no-beautify
 let *!*userName*/!* = 'John';
 let *!*userName*/!* = 'Іван';

 function showMessage() {
  let message = 'Hello, ' + *!*userName*/!*;
  let message = 'Привіт, ' + *!*userName*/!*;
  alert(message);
 }

 showMessage(); //Hello, John
 showMessage(); //Привіт, Іван
 ```

 The function has full access to the outer variable. It can modify it as well.
 Функція має повний доступ до зовнішньої змінної. Вона теж може її змінювати.

 For instance:
 Наприклад:

 ```js run
 let *!*userName*/!* = 'John';
 let *!*userName*/!* = 'Іван';

 function showMessage() {
  *!*userName*/!* = "Bob"; // (1)changed the outer variable
  *!*userName*/!* = "Богдан"; // (1)змінено зовнішню змінну

  let message = 'Hello, ' + *!*userName*/!*;
  let message = 'Здоровенькі були, ' + *!*userName*/!*;
  alert(message);
 }

 alert( userName ); // *!*John*/!*before the function call
 alert( userName ); // *!*Іван*/!*перед викликом функції showMessage

 showMessage();

 alert( userName ); // *!*Bob*/!*,the value was modified by the function
 alert( userName ); // *!*Богдан*/!*,значення було змінено після виклику функції showMessage
 ```

 The outer variable is only used if there's no local one.
 Зовнішня змінна використовується тоді, коли немає локальної.

 If a same-named variable is declared inside the function then it *shadows* the outer one. For instance, in the code below the function uses the local`userName`.The outer one is ignored:
 Якщо всередині функції є змінна з таким самим ім’ям, то вона *затьмарює* зовнішню. Наприклад, наступний код використовує локальну змінну`userName`.Зовнішня ігнорується.

 ```js run
 let userName = 'John';
 let userName = 'Іван'; // оголошення зовнішньої змінної

 function showMessage() {
 *!*
  let userName = "Bob"; //declare a local variable
  let userName = "Богдан"; //оголошення локальної змінної
 */!*

  let message = 'Hello, ' + userName; // *!*Bob*/!*
  let message = 'Привіт, ' + userName; // *!*Богдан*/!*
  alert(message);
 }

 //the function will create and use its own userName
 //функція завжди віддасть перевагу локальним змінним
 showMessage();

 alert( userName ); // *!*John*/!*,unchanged, the function did not access the outer variable
 alert( userName ); // *!*Іван*/!*,без змін, функція не змінила глобальну змінну
 ```

 ```smart header="Global variables"
 Variables declared outside of any function, such as the outer`userName`in the code above, are called *global*.
 ```smart header="Глобальні змінні"
 Змінні, оголошені поза будь-якими функціями (такі як зовнішня зміння`userName`з коду вище), називаються *глобальні* змінні.

 Global variables are visible from any function (unless shadowed by locals).
 Глобальні змінні доступні в будь-якій функції (окрім випадків, коли глобальна змінна затьмарена локальною).

 It's a good practice to minimize the use of global variables. Modern code has few or no globals. Most variables reside in their functions. Sometimes though, they can be useful to store project-level data.
 Хорошою практикою вважається мінімізація використання глобальних змінних. У сучасному коді є декалька або одна глобальна змінна. Більшість змінних знаходяться в межах функцій. Іноді, буває корисно зберігати "загальні" дані (на рівні проєкту) в таких глобальних змінних.
 ```

 ## Parameters
 For instance, the aforementioned function `showMessage(from, text)` can be called with a single argument:

 ```js
 showMessage("Ann");
 showMessage('Ann');
 ```

 That's not an error. Such a call would output `"*Ann*: undefined"`. As the value for `text` isn't passed, it becomes `undefined`.

 In the code above, if `checkAge(age)` returns `false`, then `showMovie` won't proceed to the `alert`.

 ````smart header="A function with an empty `return` or without it returns `undefined`"
 If a function does not return a value, it is the same as if it returns `undefined`:
 ````smart header="A function with an empty `return`or without it returns`undefined`" If a function does not return a value, it is the same as if it returns `undefined`:

 ```js run
 function doNothing() { /* empty */ }
 function doNothing() {
  /* empty */
 }

 alert(doNothing() === undefined); // true
 alert(doNothing() === undefined); // true
 ```

 An empty `return` is also the same as `return undefined`:
  return;
 }

 alert(doNothing() === undefined); // true
 alert(doNothing() === undefined); // true
 ```
 ````

 `````

 ````warn header="Never add a newline between `return` and the value"
 For a long expression in `return`, it might be tempting to put it on a separate line, like this:
  )
 ```
 And it will work just as we expect it to.
 ````
 `````

 ## Naming a function [#function-naming]

 ```js
 function showPrimes(n) {
  nextPrime: for (let i = 2; i < n; i++) {

    for (let j = 2; j < i; j++) {
      if (i % j == 0) continue nextPrime;
    }

    alert( i); // a prime
    alert(i); // a prime
  }
 }
 ```
 }
 ```

 The second variant is easier to understand, isn't it? Instead of the code piece we see a name of the action (`isPrime`). Sometimes people refer to such code as*self-describing*.
 The second variant is easier to understand, isn't it? Instead of the code piece we see a name of the action (`isPrime`). Sometimes people refer to such code as_self-describing_.

 So, functions can be created even if we don't intend to reuse them. They structure the code and make it readable.
Original file line number	Diff line number	Diff line change
		@@ -1,40 +1,40 @@
		#Functions
		#Функції

		Quite often we need to perform a similar action in many places of the script.
		Досить часто нам потрібно виконати подібну дію в багатьох місцях скрипту.

		For example, we need to show a nice-looking message when a visitor logs in, logs out and maybe somewhere else.
		Наприклад, нам треба показати приємне повідомлення, коли користувач входить або виходить з системи і може ще десь.

		Functions are the main "building blocks" of the program. They allow the code to be called many times without repetition.
		Функції — це головні "будівельні блоки" програми. Вони дозволяють робити ті самі дії багато разів в коді без повторення.

		We've already seen examples of built-in functions, like `alert(message)`, `prompt(message, default)`and `confirm(question)`.But we can create functions of our own as well.
		Ми вже стикались з такими вбудованими функціями, як-от `alert(message)`, `prompt(message, default)`та `confirm(question)`.Але ми теж можемо створювати свої функції.

		##Function Declaration
		##Оголошення (декларація) функцій

		To create a function we can use a function declaration.
		Щоб створити функцію нам треба її _оголосити_.

		It looks like this:
		Це виглядає ось так:

		```js
		function showMessage() {
		alert( 'Hello everyone!');
		alert('Всім привіт!');
		}
		```

		The`function` keyword goes first, then goes the name of the function, then a list of parameters between the parentheses (comma-separated, empty in the example above, we'll see examples later) and finally the code of the function, also named "the function body", between curly braces.
		Спочатку ми пишемо`function`— це ключове слово (keyword), яке дає зрозуміти комп’ютеру, що далі буде оголошення функції. Потім — назву функції, тоді список її параметрів в дужках (розділені комою). Якщо параметрів немає, ми залишаємо _пусті дужки_. І нарешті, код функції, який також називають тілом функції між фігурними дужками.

		```js
		function name(parameter1, parameter2, ... parameterN) {
		...body...
		...тіло функції...
		}
		```

		Our new function can be called by its name: `showMessage()`.
		Нашу нову функцію можна викликати, написавши її ім’я і дужки: `showMessage()`.

		For instance:
		Наприклад:

		```js run
		function showMessage() {
		alert( 'Hello everyone!' );
		alert( 'Шановні друзі!' );
		}

		!
Expand All		@@ -43,96 +43,96 @@ showMessage();
		/!
		```

		The call`showMessage()`executes the code of the function. Here we will see the message two times.
		Виклик`showMessage()`виконує код із тіла функції. В цьому випадку, ми побачимо повідомлення двічі.

		This example clearly demonstrates one of the main purposes of functions: to avoid code duplication.
		Цей приклад яскраво демонструє одну з найголовніших цілей функції - уникнення повторення коду.

		If we ever need to change the message or the way it is shown, it's enough to modify the code in one place: the function which outputs it.
		Якщо нам потрібно змінити повідомлення, достатньо змінити тіло функції, яке виводить це повідомлення.

		##Local variables
		##Локальні змінні

		A variable declared inside a function is only visible inside that function.
		Змінна, яка оголошена в функції доступна лише в тілі цієї функції.

		For example:
		До прикладу:

		```js run
		function showMessage() {
		!
		let message = "Hello, I'm JavaScript!"; //local variable
		let message = "Бажаю вам 36.6"; //локальна змінна
		/!

		alert( message );
		}

		showMessage(); //Hello, I'm JavaScript!
		showMessage(); //Бажаю вам 36.6

		alert( message ); // <--Error! The variable is local to the function
tarasyyyk marked this conversation as resolved. Show resolvedHide resolved
		alert( message ); // <--Помилка! Змінна недоступна поза функцією
		```

		##Outer variables
		##Зовнішні змінні

		A function can access an outer variable as well, for example:
		Функція може використовувати зовнішні змінні, наприклад:

		```js run no-beautify
		let !userName/! = 'John';
		let !userName/! = 'Іван';

		function showMessage() {
		let message = 'Hello, ' + !userName/!;
		let message = 'Привіт, ' + !userName/!;
		alert(message);
		}

		showMessage(); //Hello, John
		showMessage(); //Привіт, Іван
		```

		The function has full access to the outer variable. It can modify it as well.
		Функція має повний доступ до зовнішньої змінної. Вона теж може її змінювати.

		For instance:
		Наприклад:

		```js run
		let !userName/! = 'John';
		let !userName/! = 'Іван';

		function showMessage() {
		!userName/! = "Bob"; // (1)changed the outer variable
tarasyyyk marked this conversation as resolved. Show resolvedHide resolved
		!userName/! = "Богдан"; // (1)змінено зовнішню змінну

		let message = 'Hello, ' + !userName/!;
		let message = 'Здоровенькі були, ' + !userName/!;
tarasyyyk marked this conversation as resolved. Show resolvedHide resolved
		alert(message);
		}

		alert( userName ); // !John/!before the function call
		alert( userName ); // !Іван/!перед викликом функції showMessage

		showMessage();

		alert( userName ); // !Bob/!,the value was modified by the function
		alert( userName ); // !Богдан/!,значення було змінено після виклику функції showMessage
		```

		The outer variable is only used if there's no local one.
		Зовнішня змінна використовується тоді, коли немає локальної.

		If a same-named variable is declared inside the function then it shadows the outer one. For instance, in the code below the function uses the local`userName`.The outer one is ignored:
		Якщо всередині функції є змінна з таким самим ім’ям, то вона затьмарює зовнішню. Наприклад, наступний код використовує локальну змінну`userName`.Зовнішня ігнорується.

		```js run
		let userName = 'John';
		let userName = 'Іван'; // оголошення зовнішньої змінної

		function showMessage() {
		!
		let userName = "Bob"; //declare a local variable
		let userName = "Богдан"; //оголошення локальної змінної
		/!

		let message = 'Hello, ' + userName; // !Bob/!
		let message = 'Привіт, ' + userName; // !Богдан/!
		alert(message);
		}

		//the function will create and use its own userName
		//функція завжди віддасть перевагу локальним змінним
		showMessage();

		alert( userName ); // !John/!,unchanged, the function did not access the outer variable
		alert( userName ); // !Іван/!,без змін, функція не змінила глобальну змінну
		```

		```smart header="Global variables"
		Variables declared outside of any function, such as the outer`userName`in the code above, are called global.
		```smart header="Глобальні змінні"
		Змінні, оголошені поза будь-якими функціями (такі як зовнішня зміння`userName`з коду вище), називаються глобальні змінні.

		Global variables are visible from any function (unless shadowed by locals).
		Глобальні змінні доступні в будь-якій функції (окрім випадків, коли глобальна змінна затьмарена локальною).

		It's a good practice to minimize the use of global variables. Modern code has few or no globals. Most variables reside in their functions. Sometimes though, they can be useful to store project-level data.
		Хорошою практикою вважається мінімізація використання глобальних змінних. У сучасному коді є декалька або одна глобальна змінна. Більшість змінних знаходяться в межах функцій. Іноді, буває корисно зберігати "загальні" дані (на рівні проєкту) в таких глобальних змінних.
		```

		## Parameters
Expand DownExpand Up		@@ -191,7 +191,7 @@ If a function is called, but an argument is not provided, then the corresponding
		For instance, the aforementioned function `showMessage(from, text)` can be called with a single argument:

		```js
		showMessage("Ann");
		showMessage('Ann');
		```

		That's not an error. Such a call would output `"Ann: undefined"`. As the value for `text` isn't passed, it becomes `undefined`.
Expand DownExpand Up		@@ -330,13 +330,14 @@ function showMovie(age) {

		In the code above, if `checkAge(age)` returns `false`, then `showMovie` won't proceed to the `alert`.

		````smart header="A function with an empty `return` or without it returns `undefined`"
		If a function does not return a value, it is the same as if it returns `undefined`:
		````smart header="A function with an empty `return`or without it returns`undefined`" If a function does not return a value, it is the same as if it returns `undefined`:

		```js run
		function doNothing() { /* empty */ }
		function doNothing() {
		/* empty */
		}

		alert(doNothing() === undefined); // true
		alert(doNothing() === undefined); // true
		```

		An empty `return` is also the same as `return undefined`:
Expand All		@@ -346,9 +347,10 @@ function doNothing() {
		return;
		}

		alert(doNothing() === undefined); // true
		alert(doNothing() === undefined); // true
		```
		````

		`````

		````warn header="Never add a newline between `return` and the value"
		For a long expression in `return`, it might be tempting to put it on a separate line, like this:
Expand DownExpand Up		@@ -376,7 +378,7 @@ return (
		)
		```
		And it will work just as we expect it to.
		````
		`````

		## Naming a function [#function-naming]

Expand DownExpand Up		@@ -440,12 +442,11 @@ The first variant uses a label:
		```js
		function showPrimes(n) {
		nextPrime: for (let i = 2; i < n; i++) {

		for (let j = 2; j < i; j++) {
		if (i % j == 0) continue nextPrime;
		}

		alert( i); // a prime
		alert(i); // a prime
		}
		}
		```
Expand All		@@ -470,7 +471,7 @@ function isPrime(n) {
		}
		```

		The second variant is easier to understand, isn't it? Instead of the code piece we see a name of the action (`isPrime`). Sometimes people refer to such code asself-describing.
		The second variant is easier to understand, isn't it? Instead of the code piece we see a name of the action (`isPrime`). Sometimes people refer to such code as_self-describing_.

		So, functions can be created even if we don't intend to reuse them. They structure the code and make it readable.

Expand Down