[리팩터링] 챕터06. 기본적인 리팩터링(6-8 매개변수 객체 만들기)

 

😀 책에서 기억하고 싶은 내용을 써보세요.

 

배경

데이터 항목 여러 개가 이 함수에서 저 함수로 몰려다니는 경우를 자주 본다.

저자는 이런 데이터 무리를 발견하면 데이터 구조 하나로 모아주곤 한다.

• 데이터 뭉치를 데이터 구조로 묶으면 데이터 사이의 관계가 명확해진다는 이점을 얻는다.
• 함수가 이 데이터 구조를 받게 하면 매개변수 수가 줄어든다.
• 같은 데이터 구조를 사용하는 모든 함수가 원소를 참조할 때 항상 똑같은 이름을 사용하기 때문에 일관성도 높여준다.

 

 

절차

1. 적당한 데이터 구조가 아직 마련되어 있지 않다면 새로 만든다.
   • 개인적으로 클래스로 만드는 걸 선호한다. 나중에 동작까지 함께 묶기 좋기 때문이다. 저자는 주로 데이터 구조를 값 객체(Value Object)로 만든다고 한다.
2. 테스트한다.
3. 함수 선언 바꾸기로 새 데이터 구조를 매개변수로 추가한다.
4. 테스트한다.
5. 함수 호출 시 새로운 데이터 구조 인스턴스를 넘기도록 수정한다. 하나씩 수정할 때마다 테스트
6. 기존 매개변수를 사용하던 코드를 새 데이터 구조의 원소를 사용하도록 바꾼다.
7. 다 바꿨다면 기존 매개변수를 제거하고 테스트한다.

 

예시

온도 측정값 배열에서 정상 작동 범위를 벗어난 것이 있는지 검사하는 코드(예시)

const station = { name: "ZB1",
				readings: [
                            {temp: 47, time: "2016-11-10 09:10"},
                            {temp: 53, time: "2016-11-10 09:20"},
                            {temp: 58, time: "2016-11-10 09:30"},
                            {temp: 53, time: "2016-11-10 09:40"},
                            {temp: 51, time: "2016-11-10 09:50"},
                        ]
};

 

정상 범위를 벗어난 측정값을 찾는 함수

function readingOutsideRange(station, min, max) {
	return station.readings
			.filter(r => r.temp < min || r.temp > max);
}

 

호출문

alerts = readingsOutsideRange(station,
                            operatingPlan.temperatureFloor, // 최저 온도
                            operatingPlan.temperatureCeiling); // 최고 온도

operatingPlan의 데이터 항목 두 개를 쌍으로 가져와서 readingOutsideRange()로 전달한다.

그리고 operatingPlan은 범위의 시작과 끝 이름을 readingOutsideRange()와 다르게 표현한다.

이와 같은 범위라는 개념은 객체 하나로 묶어 표현하는 게 나은 대표적인 예다

 

 

class NumberRange {
	constructor(min, max) {
		this._data = {min: min, max: max};
	}
	get min() {return this._data.min;}
	get max() {return this._data.max;}
}

먼저 묶은 데이터를 표현하는 클래스부터 선언한다.

 

function readingsOutsideRange(station, min, max, range) {
	return station.readings
        .filter(r => r.temp < min || r.temp > max);
}

새로 만든 객체를 readingsOutsideRange()의 매개변수로 추가하도록 함수 선언을 바꾼다.

 

// 호출문
alerts = readingsOutsideRange(station,
                            operatingPlan.temperatureFloor,
                            operatingPlan.temperatureCeiling,
                            null);

자바스크립트라면 호출문을 예전 상태로 둬도 되지만, 다른 언어를 사용할 때는

위와 같이 새 매개변수 자리에 null을 적어둔다.

 

const range = new NumberRange(operatingPlan.temperatureFloor,
                            operatingPlan.temperatureCeiling);
alerts = readingsOutsideRange(station,
                            operatingPlan.temperatureFloor,
                            operatingPlan.temperatureCeiling,
                            range);

이제 온도 범위를 객체 형태로 전달하도록 호출문을 하나씩 바꾼다.

바꾼 후 테스트를 한다.

 

 

function readingsOutsideRange(station, min, max, range) { 	// <---- max 매개변수 제거
	return station.readings
		.filter(r => r.temp < min || r.temp > range.max);
}

// 호출문
const range = new NumberRange(operatingPlan.temperatureFloor,
                            operatingPlan.temperatureCeiling);
alerts = readingsOutsideRange(station,
                            operatingPlan.temperatureFloor,
                           	operatingPlan.temperatureCeiling,		// <--- 매개변수 제거
                            range);

이제 기존 매개변수를 사용하는 부분을 변경한다. 최댓값부터 바꾼다.

바꾼 후 한번 더 테스트를 한다.

 

 

function readingsOutsideRange(station, min, range) {		// <--- min 매개변수 제거
	return station.readings
			.filter(r => r.temp < range.min || r.temp > range.max);
}

// 호출문
const range = new NumberRange(operatingPlan.temperatureFloor,
                            operatingPlan.temperatureCeiling);
alerts = readingsOutsideRange(station,
                            operatingPlan.temperatureFloor,		// <--- 매개변수 제거
                            range);

다음 매개변수도 제거한다.

 

 

 

🤔 오늘 읽은 소감은? 떠오르는 생각을 가볍게 적어보세요.

• 스프링을 사용하면서 DTO로 데이터를 묶어서 전달하는 일을 했습니다.
  • 이 방법이 매개변수를 더 깔끔하고 추상개념을 격상된다는 것을 알게 되었습니다.
• DTO던 VO던 결국 데이터를 전송하는 객체를 만들어 전송하는 개념이 중요하다는 걸 알게 되었습니다.

 

 

🔎 궁금한 내용이 있거나, 잘 이해되지 않는 내용이 있다면 적어보세요.

• 공부를 하면서 자바를 사용하면서만 매개변수를 객체로 전달하는 것을 해봤습니다. 다른 언어에서는 어떤 방식으로 매개변수에 객체를 담아 전달하는지 궁금합니다.
  • 자바스크립트는 예시로 나와있지만 실제 프로젝트에서 어떻게 사용하는지 궁금합니다.