JavaRush /Курси /Frontend SELF UA /Параметри функцій

Параметри функцій

Frontend SELF UA
Рівень 35 , Лекція 3
Відкрита

4.1 Параметри функцій

Параметри функцій в JavaScript дозволяють передавати значення в функції для їх обробки. Це робить функції більш гнучкими та адаптивними. У цій темі ми розглянемо основні аспекти роботи з параметрами функцій в JavaScript, включаючи параметри за замовчуванням і залишкові параметри.

Параметри вказуються в круглих дужках після імені функції. При виклику функції значення цих параметрів передаються у відповідні змінні всередині функції.

Приклад:

У функції greet() визначені два параметри: name і age. При виклику функції значення Alice і 30 передаються у ці параметри.

JavaScript
    
      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.

JavaScript
    
      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. Якщо аргумент не передано, буде використано значення за замовчуванням.

JavaScript
    
      function greet(name = 'Guest') {
        return `Hello, ${name}!`;
      }

      console.log(greet('Alice')); // Виведе: Hello, Alice!
      console.log(greet());        // Виведе: Hello, Guest!
    
  

Приклад 2: Параметри за замовчуванням з виразами

У цьому прикладі параметр tax за замовчуванням розраховується як 20% від price, якщо не було передано інший аргумент.

JavaScript
    
      function calculatePrice(price, tax = price * 0.2) {
        return price + tax;
      }

      console.log(calculatePrice(100));  // Виведе: 120
      console.log(calculatePrice(100, 15)); // Виведе: 115
    
  

Приклад 3: Параметри за замовчуванням залежать від інших параметрів

У цьому прикладі параметри за замовчуванням дозволяють створити користувача з передвизначеними ролями та статусами.

JavaScript
    
      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() використовує залишкові параметри для сумування всіх переданих аргументів.

JavaScript
    
      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.

JavaScript
    
      function showItems(firstItem, ...otherItems) {
        console.log(`Перший елемент: ${firstItem}`);
        console.log(`Інші елементи: ${otherItems.join(', ')}`);
      }

      showItems('apple', 'banana', 'cherry', 'date');

      // Виведе:
      // Перший елемент: apple
      // Інші елементи: banana, cherry, date
    
  

Приклад 3: Функція з динамічними аргументами

У цьому прикладі функція createMessage() приймає перший аргумент messageType і збирає всі інші параметри в масив messages, щоб створити повідомлення.

JavaScript
    
      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
    
  
Коментарі
ЩОБ ПОДИВИТИСЯ ВСІ КОМЕНТАРІ АБО ЗАЛИШИТИ КОМЕНТАР,
ПЕРЕЙДІТЬ В ПОВНУ ВЕРСІЮ