4.1 Параметри функцій
Параметри функцій в JavaScript дозволяють передавати значення в функції для їх обробки. Це робить функції більш гнучкими та адаптивними. У цій темі ми розглянемо основні аспекти роботи з параметрами функцій в JavaScript, включаючи параметри за замовчуванням і залишкові параметри.
Параметри вказуються в круглих дужках після імені функції. При виклику функції значення цих параметрів передаються у відповідні змінні всередині функції.
Приклад:
У функції greet() визначені два параметри: name і age. При виклику функції значення Alice і 30 передаються у ці параметри.
function greet(name, age) {
return `Hello, ${name}! You are ${age} years old.`;
}
console.log(greet('Alice', 30)); // "Hello, Alice! You are 30 years old."
Обробка невизначених параметрів
Якщо параметр не передався при виклику функції, його значення буде undefined. Це може призвести до помилок, якщо з таким параметром виконуються операції, що не підтримують undefined.
Приклад:
У функції greet() перевіряється, чи передано параметр name. Якщо ні, використовується рядок Guest.
function greet(name) {
if (name === undefined) {
return 'Hello, Guest!';
}
return `Hello, ${name}!`;
}
console.log(greet()); // "Hello, Guest!"
console.log(greet('Bob')); // "Hello, Bob!"
4.2 Параметри за замовчуванням
Параметри за замовчуванням дозволяють задати значення, які будуть використовуватися, якщо аргумент не передано при виклику функції або передано як undefined. Це особливо корисно для створення функцій з опціональними параметрами.
Синтаксис:
function name (arg1 = value1, arg2 = value2) {
// function body
}
Приклад 1: Проста функція з параметрами за замовчуванням
У цьому прикладі функція greet() має параметр name зі значенням за замовчуванням Guest. Якщо аргумент не передано, буде використано значення за замовчуванням.
function greet(name = 'Guest') {
return `Hello, ${name}!`;
}
console.log(greet('Alice')); // Виведе: Hello, Alice!
console.log(greet()); // Виведе: Hello, Guest!
Приклад 2: Параметри за замовчуванням з виразами
У цьому прикладі параметр tax за замовчуванням розраховується як 20% від price, якщо не було передано інший аргумент.
function calculatePrice(price, tax = price * 0.2) {
return price + tax;
}
console.log(calculatePrice(100)); // Виведе: 120
console.log(calculatePrice(100, 15)); // Виведе: 115
Приклад 3: Параметри за замовчуванням залежать від інших параметрів
У цьому прикладі параметри за замовчуванням дозволяють створити користувача з передвизначеними ролями та статусами.
function createUser(name, role = 'user', isActive = true) {
return { name, role, isActive };
}
console.log(createUser('Alice')); // Виведе: { name: 'Alice', role: 'user', isActive: true }
console.log(createUser('Bob', 'admin')); // Виведе: { name: 'Bob', role: 'admin', isActive: true }
console.log(createUser('Charlie', 'moderator', false)); // Виведе: { name: 'Charlie', role: 'moderator', isActive: false }
4.3 Залишкові параметри
Залишкові параметри дозволяють функції приймати будь-яку кількість аргументів і збирати їх в масив. Це корисно для створення функцій, які можуть працювати зі змінною кількістю аргументів.
Синтаксис:
function name (arg1, arg2, ...argArray) {
// function body
}
Приклад 1: Сумування всіх переданих аргументів
У цьому прикладі функція sumAll() використовує залишкові параметри для сумування всіх переданих аргументів.
function sumAll(...numbers) {
return numbers.reduce((sum, num) => sum + num, 0);
}
console.log(sumAll(1, 2, 3)); // Виведе: 6
console.log(sumAll(4, 5, 6, 7, 8)); // Виведе: 30
Приклад 2: Функція з фіксованими та залишковими параметрами
У цьому прикладі функція showItems() приймає фіксований параметр firstItem і невизначену кількість інших аргументів, зібраних у масив otherItems.
function showItems(firstItem, ...otherItems) {
console.log(`Перший елемент: ${firstItem}`);
console.log(`Інші елементи: ${otherItems.join(', ')}`);
}
showItems('apple', 'banana', 'cherry', 'date');
// Виведе:
// Перший елемент: apple
// Інші елементи: banana, cherry, date
Приклад 3: Функція з динамічними аргументами
У цьому прикладі функція createMessage() приймає перший аргумент messageType і збирає всі інші параметри в масив messages, щоб створити повідомлення.
function createMessage(messageType, ...messages) {
return `[${messageType.toUpperCase()}]: ${messages.join(' ')}`;
}
console.log(createMessage('info', 'This', 'is', 'an', 'informational', 'message'));
// Виведе: [INFO]: This is an informational message
console.log(createMessage('error', 'An', 'error', 'occurred'));
// Виведе: [ERROR]: An error occurred
ПЕРЕЙДІТЬ В ПОВНУ ВЕРСІЮ