자바스크립트에서 객체 값을 반환하는 함수를 만들 때, 매개 변수로 전달하는 방법 2가지를 정리한다.

1. 비구조화 할당

비구조화 할당이란 객체나 배열 속성을 분해하여 개별 변수에 값을 쉽게 할당할 수 있는 문법이다.

함수 매개변수를 객체 형태 key: value 로 전달한다.
key: value 형태로 전달하므로, 값이 많아질 때 가독성이 높아진다.

함수를 구현할 때에 매개변수에 소괄호 {}를 사용하여 나타낸다.

const makePerson = ({ firstName, lastName, address}) => {
  return {
    name: `${firstName} ${lastName}`,
    address: address,
  };
};

const person = makePerson({
  firstName: 'popo',
  lastName: 'park',
  age: 26,
  address: 'seoul',
  job: 'student',
});

console.log(person); // { name: popo park, address: seoul }

함수 매개변수를 전달할 때 순서 의존성이 없다. 즉, 아무 순서대로 전달해도 상관 없다.
또한 선택적 인수 처리가 가능하다. 즉, 함수에서 요구하는 매개 변수를 모두 전달하지 않아도 오류가 발생하지 않는다. (undefined로 정의된다)

const makePerson = ({ firstName, lastName, address}) => {
  return {
    name: `${firstName} ${lastName}`,
    address: address,
  };
};

const person = makePerson({
  address: 'seoul',
  lastName: 'park',
});

console.log(person); // { name: undefined park, address: seoul }

가독성이 좋고, 버그를 일으키지 않는다는 장점이 있다.
단, 객체을 생성하여 매개변수로 전달해야 하므로 구현 복잡도는 올라간다.

2. 개별 매개변수 전달

일반 함수의 매개 변수로 전달하는 방법이다.
각각의 값을 독립적인 매개변수로 전달받는다.
인자 전달 순서가 중요하며, 모든 인수를 정확한 index에 전달해야 한다.

const makePerson = ( firstName, lastName, address) => {
  return {
    name: `${firstName} ${lastName}`,
    address: address,
  };
};

const person1 = makePerson('popo', 'park', 'seoul');
const person2 = makePerson('popo', 'seoul', 'park');
const person3 = makePerson('popo', 'seoul', 'park');

console.log(person); // { name: popo park, address: seoul }