Паттерн JS умные параметры функции - IZIART

Разработка сайтов
индивидуальный дизайн

Главная » JS » Паттерн JS умные параметры функции

Паттерн JS умные параметры функции

Обновлено: 05.10.2023
js

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

Используя синтаксис деструктуризации можно реализовать удобный способ передачи параметров в функцию. С возможностью задать значения параметров по умолчанию, если вдруг какой-либо из них не будет передан и тем самым избавиться от возможных ошибок.

function connect ({
	host = 'localhost',
	port = 3000,
	user = 'default'
}) {
	console.log(host); // localhost
	console.log(port); // 3000
	console.log(user); // default
}

connect({});

В примере выше мы создаем функцию принимающую параметром объект и сразу присваиваем свойствам объекта значения по умолчанию, на случай если не все свойства будут переданы.

При вызове функции мы передаем параметром пустой объект, чтобы избежать ошибки обязательного параметра, далее мы рассмотрим как решить и эту проблему более красиво.
Как результат работы, функция выведет в консоль значения host, port, user, которые были заданы по умолчанию.

К содержанию ↑

Пример передачи объекта с отсутствующими свойствами

Сейчас мы проделаем все тоже самое, только в параметр функции передадим объект, но в котором не все свойства объявлены

let param = {
	port: 8080,
	user: 'admin'
}

function connect ({
	host = 'localhost',
	port = 3000,
	user = 'default'
}) {
	console.log(host); // localhost
	console.log(port); // 8080
	console.log(user); // admin
}

connect(param); // передаем объект

Результатом работы будет все тоже самое как и в первый раз, только значения переменных port и user теперь будет не по умолчанию, а браться из переданного объекта.

Здесь мы не передали свойство host в объекте param? но оно подставится по умолчанию и будет равно localhost.

Так же плюсом такой передачи параметров в функцию, является то, что свойства объекта можно определять не по порядку, как при объявлении функции, а в произвольном порядке.

К содержанию ↑

Избавляемся от ошибки передачи обязательного параметра

В первом примере мы чтобы избежать ошибки отсутствия обязательного параметра, передавали в функцию пустой объект, а его свойства уже присваивались по умолчанию.
Если вызвать нашу функцию без параметра, будет следующая ошибка

TypeError: (destructured parameter) is undefined

Итак, чтобы избавиться от неё можно задать значение по умолчанию для самого параметра, а именно добавив значение по умолчанию для параметра пустой объект: = {}
Так мы избавимся от ошибки и все будет работать, а значения подставятся по умолчанию.

function connect ({
	host = 'localhost',
	port = 3000,
	user = 'default'
} = {} /*присваиваем пустой объект*/ ) {
	console.log(host); // localhost
	console.log(port); // 3000
	console.log(user); // default
}

connect(); // не передаем параметра совсем