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

pic

JavaScript дуже схожий на приготування їжі. Уяви, що ти готуєш чінчін. Тобі потрібні інгредієнти, правда? Борошно, цукор і, можливо, трохи масла. У світі JavaScript параметри функцій — це як заповнювачі для цих інгредієнтів, а аргументи — це справжні інгредієнти, які ти використовуєш для приготування чінчіну.

Розглянемо це детальніше:

Що таке функція?

Функція — це багаторазовий блок коду, який робить щось, коли ти його “викликаєш”. Подумай про це як про твого особистого кухаря, який готує чінчін. Ти просто кажеш, що потрібно зробити, а він працює.

Ось проста функція:

function makeChinchin(flour, sugar) {  
 console.log(`Твій чінчін з ${flour} чашками борошна і ${sugar} ложками цукру готовий!`);  
}

Параметри: Заповнювачі

У наведеному прикладі flour і sugar — це параметри. Вони як список покупок… речі, які функція потребує для виконання своєї роботи.

Аргументи: Справжні інгредієнти

Коли ти насправді викликаєш функцію, ти даєш їй аргументи — конкретні “інгредієнти”, які їй потрібні. Наприклад:

makeChinchin(2, 5);

Чому це важливо?

Параметри та аргументи роблять функції гнучкими. Замість того, щоб писати 10 різних рецептів чінчіну, ти пишеш один, і можеш використовувати його з будь-якими вимірами.

Трошки веселий приклад

Давай вийдемо за межі чінчіну. Припустимо, ти обчислюєш, скільки цукру додати до чаю:

function calculateSugar(spoons, cupsOfTea) {  
 return spoons * cupsOfTea;  
}

Тепер, коли ти готуєш чай, ти можеш викликати:

console.log(calculateSugar(2, 3));   
console.log(calculateSugar(1, 5));

Поширені помилки, яких слід уникати

  1. Не передано достатньо аргументів
    Якщо функція очікує два інгредієнти, а ти передав лише один, вона не працюватиме, як очікується:
makeChinchin(2);
  1. Змішування порядку
    Порядок має значення.
makeChinchin(5, 2);

Висновок

  • Параметри = заповнювачі в рецепті.
  • Аргументи = справжні інгредієнти.
  • Функції = кухар, який робить всю роботу за тебе.

Перекладено з: Function Parameters and Arguments in JavaScript

Leave a Reply

Your email address will not be published. Required fields are marked *