JS Tower
JavaScript & TypeScriptМодуль 2: Функции

Параметры и аргументы

Передача данных в функции

Цель урока

В этом уроке ты научишься:

  • Передавать данные в функции
  • Использовать параметры по умолчанию
  • Работать с rest-параметрами

Параметры и аргументы

Параметры — переменные в объявлении функции. Аргументы — значения при вызове функции.

function greet(name, greeting) {  // параметры
  console.log(greeting + ", " + name + "!");
}

greet("Иван", "Привет");  // аргументы
// "Привет, Иван!"

Параметры по умолчанию

function greet(name, greeting = "Привет") {
  console.log(greeting + ", " + name + "!");
}

greet("Иван");           // "Привет, Иван!"
greet("Иван", "Здравствуй"); // "Здравствуй, Иван!"

Выражения как значения по умолчанию

function createId(prefix = "id", number = Date.now()) {
  return prefix + "_" + number;
}

console.log(createId());        // "id_1234567890"
console.log(createId("user"));  // "user_1234567890"

Rest-параметры

Собирает оставшиеся аргументы в массив:

function sum(...numbers) {
  let total = 0;
  for (let n of numbers) {
    total += n;
  }
  return total;
}

console.log(sum(1, 2, 3));     // 6
console.log(sum(1, 2, 3, 4, 5)); // 15

Комбинация с обычными параметрами

function greetAll(greeting, ...names) {
  for (let name of names) {
    console.log(greeting + ", " + name + "!");
  }
}

greetAll("Привет", "Иван", "Мария", "Пётр");
// "Привет, Иван!"
// "Привет, Мария!"
// "Привет, Пётр!"

Важно

Rest-параметр должен быть последним в списке параметров.


Объект arguments

В обычных функциях доступен объект arguments:

function showArgs() {
  console.log(arguments.length);
  console.log(arguments[0]);
}

showArgs("a", "b", "c");
// 3
// "a"

Предпочитай rest

arguments — устаревший способ. Используй rest-параметры ...args.


Передача по значению vs по ссылке

Примитивы — по значению

function double(num) {
  num = num * 2;
  console.log("Внутри:", num);
}

let x = 5;
double(x);
console.log("Снаружи:", x);
// Внутри: 10
// Снаружи: 5 (не изменился)

Объекты — по ссылке

function addAge(user) {
  user.age = 25;
}

let person = { name: "Иван" };
addAge(person);
console.log(person);
// { name: "Иван", age: 25 } (изменился!)

Деструктуризация параметров

// Объект
function greet({ name, age }) {
  console.log(name + ", " + age + " лет");
}

greet({ name: "Иван", age: 25 });

// Массив
function sum([a, b, c]) {
  return a + b + c;
}

console.log(sum([1, 2, 3])); // 6

Со значениями по умолчанию

function createUser({ name = "Гость", age = 0 } = {}) {
  return { name, age };
}

console.log(createUser());              // { name: "Гость", age: 0 }
console.log(createUser({ name: "Иван" })); // { name: "Иван", age: 0 }

Практика

Задание 1: Параметры по умолчанию

Задача: Создай функцию power(base, exponent) с exponent = 2 по умолчанию.

Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
9
8

Задание 2: Rest-параметры

Задача: Создай функцию max, которая находит максимальное число.

Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
10

Задание 3: Деструктуризация

Задача: Создай функцию formatUser, которая принимает объект и возвращает строку.

Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
Иван (25 лет)

Проверь себя

  1. Чем параметры отличаются от аргументов?
  2. Что делает rest-параметр?
  3. Как передаются объекты в функции?