[클린코드 자바스크립트] 임시변수 제거하기

임시변수 제거하기

 

임시변수란?

스코프 안에서 전역변수 처럼 사용되는 변수를 일컫는다.

function getDOMElement() {
  const result = {}; // 임시 변수
  
  result.title = document.querySelector('.title');
  result.content = document.querySelector('.content');
  
  return result;
}

당장은 이 임시변수가 큰 문제를 일으키진 않지만, 해당 함수가 커질 경우 임시변수가 스코프 내에서 전역 변수로 쓰여질 위험이 있고, 개발자들이 임시변수에 접근하여 조작하므로 인해 예상치 못한 사이드 이펙트를 야기할 수 있다. 이 부분을 예방하기 위해서는 함수를 크게 만들지 않고 하나의 일만 하도록 쪼개는 것이 가장 좋다.

 

function getDOMElement() {
  return {
    title : document.querySelector('.title'),
    content: document.querySelector('.content'),
  };
}

 

아니면 이런식으로 바로 원하는 객체를 리턴 시켜버리는 방법도 있다. 이렇게 하면 이 함수는 객체를 리턴하는 하나의 행동만 하기 때문에 더 명확해진다.

 

결론

임시변수를 제거해야 하는 이유는 명령형 코드를 줄일 수 있고, 임시변수를 본 다른 개발자가 추가적인 코드를 작성하고 싶은 유혹(?)을 없앨 수 있다. 

결국 해결책은 함수를 최대한 하나의 일만 하도록 하고 추상화, 값을 바로 반환, 선언형으로 코드를 작성하는 것이다!