매개변수와 return문을 정리하라

Tip 01 매개 변수 기본값을 생성해라.

 

매개변수에 기본값을 설정하면 함수 호출 시 값이 없더라도 에러 없이 동작할 수 있다.
특히 단위 변환 함수처럼 자주 호출되는 함수에 유용하다.

 

다음은 매개 변수를 사용하지 않을때:

• 조건문 많고, 수식 중복되고, 읽기 귀찮음
• 숫자 포맷 로직도 반복되고 재사용 어려움

function convert(pound, unit) {
  if (!unit) unit = 'kg';
  let result;
  if (unit === 'kg') {
    result = Math.round(pound * 0.453592 * 100) / 100;
  } else if (unit === 'oz') {
    result = Math.round(pound * 16 * 100) / 100;
  } else {
    result = pound;
  }
  return result;
}

 

매개변수 기본값 + 헬퍼 함수로 개선

아래처럼 작성하면, 가독성과 유지보수성이 훨씬 좋아진다.

• 단위별 계산은 객체로 따로 분리
• 반올림 처리는 헬퍼 함수에서
• 기본값은 함수 선언부에서 깔끔하게

// 소수점 반올림 함수
function roundTo2Decimals(value) {
  return Math.round(value * 100) / 100;
}

// 단위 변환 함수
function convertPound(pound, unit = 'kg') {
  const conversionRates = {
    kg: 0.453592,
    oz: 16,
  };

  const rate = conversionRates[unit];
  return rate ? roundTo2Decimals(pound * rate) : pound;
}

간단정리

매개변수 기본값 하나만으로 모든 걸 해결할 순 없다.
하지만 이런 방식은 다른 개발자도 빠르게 이해 가능한 구조를 만들어준다.

 

---

 

Tip 02 해체할당으로 객체 속성에 접근하라

 

해체할당(Destructuring Assignment)은 객체나 배열에서 필요한 값만 쉽게 꺼내는 방법이다.
기존처럼 obj.key로 일일이 꺼내는 것보다 간결하고 의도도 명확하게 표현할 수 있다.

 

예제: 사진 정보 객체

const photo = {
  title: '바다 사진',
  url: 'https://example.com/ocean.jpg',
  width: 1920,
  height: 1080,
  takenAt: '2024-12-20',
  author: 'jane_doe',
};

 

기존 방식: 일일이 꺼내기

const title = photo.title;
const url = photo.url;
const width = photo.width;

• 중복되는 photo.가 계속 반복되고,
• 속성이 많아질수록 코드도 길어지고 가독성 떨어짐

해체할당 사용하기

const { title, url, width } = photo;

console.log(title); // '바다 사진'
console.log(url);   // 'https://example.com/ocean.jpg'
console.log(width); // 1920

• 필요한 값만 딱 뽑아쓸 수 있어서 깔끔함
• 변수명도 자동 매칭돼서 실수 줄어듦

스프레드 연산자로 특정 속성만 제외하고 가져오기

const { url, ...rest } = photo;

console.log(url);   // 'https://example.com/ocean.jpg'
console.log(rest);  // 나머지 속성들 (title, width, height, takenAt, author)

간단정리

해체할당은 단순히 짧게 쓰는 문법을 넘어서,
코드 의도를 명확히 하고
불필요한 반복을 줄여주고
협업 시 다른 개발자도 읽기 쉬운 구조를 만들어준다