Как задать значение параметра функции по умолчанию в JavaScript?
Параметры по умолчанию (ES6+) — современный и правильный способ
Да, вы всё верно начали. Начиная с ECMAScript 6 (ES6), в JavaScript появилась поддержка параметров по умолчанию. Синтаксис очень простой и интуитивный:
function greet(name = "Гость") {
return "Привет, " + name + "!";
}
console.log(greet("Анна")); // Привет, Анна!
console.log(greet()); // Привет, Гость!
console.log(greet(undefined)); // Привет, Гость! (undefined тоже триггерит значение по умолчанию)
console.log(greet(null)); // Привет, null! (null не триггерит значение по умолчанию)
Обратите внимание на важный момент: значение по умолчанию срабатывает только если передан undefined (или аргумент не передан вовсе). null, 0, пустая строка "" и false НЕ вызывают подстановку значения по умолчанию.
Как это работает под капотом?
Параметры по умолчанию вычисляются в момент вызова функции, а не при её определении. Это значит, что вы можете использовать даже другие параметры функции или вызовы других функций:
function multiply(a, b = a * 2) {
return a * b;
}
console.log(multiply(5)); // 5 * 10 = 50 (b = a * 2 = 10)
console.log(multiply(5, 3)); // 5 * 3 = 15 (b передан явно)
Старый способ (до ES6) — проверка на undefined
До появления параметров по умолчанию разработчики использовали проверку внутри функции:
function greet(name) {
if (typeof name === 'undefined') {
name = "Гость";
}
// или более короткая запись:
// name = name || "Гость";
return "Привет, " + name + "!";
}
Однако способ с || (логическое ИЛИ) имеет подводный камень: он сработает для любого falsy-значения (0, "", false, null, NaN), а не только для undefined.
Какой способ лучше?
- Параметры по умолчанию (ES6+) — читаемее, короче, понятнее. Используйте их, если пишете современный код (и не поддерживаете очень старые браузеры, вроде Internet Explorer 10).
- Проверка на
undefined— если вам нужно поддерживать очень старые браузеры или вы хотите явно контролировать логику. - Оператор
||— используйте с осторожностью, только если вы уверены, что falsy-значения не являются допустимыми аргументами.
Продвинутые возможности
Параметры по умолчанию можно комбинировать с деструктуризацией объектов:
function createUser({ name = "Гость", age = 18 } = {}) {
return { name, age };
}
console.log(createUser({ name: "Анна" })); // { name: "Анна", age: 18 }
console.log(createUser()); // { name: "Гость", age: 18 }
Это особенно полезно, когда функция принимает объект с настройками.
<<Альтернативный подход: деструктуризация с параметрами по умолчанию
Если ваша функция принимает объект с множеством опций, удобно использовать деструктуризацию прямо в параметрах. Это часто встречается в современных библиотеках и фреймворках:
function configure({ host = "localhost", port = 3000, debug = false } = {}) {
console.log(`Сервер запущен на ${host}:${port}`);
if (debug) console.log("Режим отладки включён");
}
// Использование
configure({ host: "example.com", port: 8080, debug: true });
// Сервер запущен на example.com:8080
// Режим отладки включён
configure(); // Все параметры по умолчанию
// Сервер запущен на localhost:3000
Обратите внимание на = {} в конце — это значение по умолчанию для самого объекта. Без него вызов configure() без аргументов вызовет ошибку, потому что нельзя деструктурировать undefined.
Такой подход делает код более читаемым, особенно когда у функции много необязательных параметров. Вместо того чтобы запоминать порядок аргументов, вы передаёте именованные свойства.