개요
목적과 구현을 분리하는 방식을 기준으로 삼는다.
코드를 보고 무슨 일을 하는지 파악하는데 함참 걸린다면 그 부분을 함수로 추출한 뒤 '무슨 일'에 대한 명확한 이름을 붙인다.
장황한 주석이 붙은 코드 뭉치는 함수 추출 대상이 될 가능성이 높다.
일반적으로 함수가 6줄 이하가 되도록 잘게 유지한다. 이로 인한 성능 저하는 거의 없다.
함수가 짧으면 오히려 컴파일러가 최적화할 기회를 얻는다.
최적화에 대한 고민이 생길 때 최적화 지침을 상기하자
첫 번째, 하지 마라
두 번째, 전문가일 경우라도 아직 하지 마라
예시 : 유효범위를 벗어나는 변수가 없을 때
function printOwing(invoice){ let outstanding = 0; console.log("******************"); console.log("**** 고객 채무 ****") console.log("******************"); //미해결 채무 for(const o of invoice.orders){ outstanding += o.amount; } //마감일 const today = Clock.today; invoice.dueDate = new Date(today.getFullYear(), today.getMonth(), today.getDate()+30); console.log(`고객명 : ${invoice.customer}`); console.log(`채무액 : ${outstanding}`); console.log(`마감일 : ${invoice.dueDate.toLocaleDateString()}`); } |
//유효범위를 벗어나는 변수가 없을 때 function printOwing(invoice){ let outstanding = 0; printBanner(); //미해결 채무 for(const o of invoice.orders){ outstanding += o.amount; } //마감일 const today = Clock.today; invoice.dueDate = new Date(today.getFullYear(), today.getMonth(), today.getDate()+30); printDetails(); function printDetails() { console.log(`고객명 : ${invoice.customer}`); console.log(`채무액 : ${outstanding}`); console.log(`마감일 : ${invoice.dueDate.toLocaleDateString()}`); } function printBanner() { console.log("******************"); console.log("**** 고객 채무 ****"); console.log("******************"); } } |
리팩터링 란에 존재
예시: 지역 변수를 사용할 때
지역변수를 사용하지만 다른 값을 다시 대입하지 않을 때
//지역 변수를 사용할 때 function printOwing(invoice){ let outstanding = 0; printBanner(); //미해결 채무 for(const o of invoice.orders){ outstanding += o.amount; } //마감일 const today = Clock.today; invoice.dueDate = new Date(today.getFullYear(), today.getMonth(), today.getDate()+30); //세부 사항을 출력한다 console.log(`고객명 : ${invoice.customer}`); console.log(`채무액 : ${outstanding}`); console.log(`마감일 : ${invoice.dueDate.toLocaleDateString()}`); function printBanner() { console.log("******************"); console.log("**** 고객 채무 ****"); console.log("******************"); } } |
//중첩 함수가 지원되지 않는 언어는 이렇게 넣어줘야 할 것 printDetails(invoice, outstanding); function printDetails(invoice, outstanding) { console.log(`고객명 : ${invoice.customer}`); console.log(`채무액 : ${outstanding}`); console.log(`마감일 : ${invoice.dueDate.toLocaleDateString()}`); } |
recordDueDate(invoice); //중첩 함수가 지원되지 않는 언어는 이렇게 넣어줘야 할 것 printDetails(invoice, outstanding); function recordDueDate(invoice) { const today = Clock.today; invoice.dueDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 30); } |
예시: 지역 변수의 값을 변경할 때
이럴 경우 매개변수가 들어가는 지역 변수에 대한 임시 변수를 새로 하나 만들어 그 변수를 사용한다.
let outstanding = 0; printBanner(); //미해결 채무 for(const o of invoice.orders){ outstanding += o.amount; } |
printBanner(); //문장 슬라이드로 사용되는 곳 근처로 옮김 let outstanding = 0; for(const o of invoice.orders){ outstanding += o.amount; } |
printBanner(); let outstanding = 0; for(const o of invoice.orders){ outstanding += o.amount; } //추출할 부분을 새로운 함수로 복사 function calculateOutstanding(invoice){ let outstanding = 0; for(const o of invoice.orders){ outstanding += o.amount; } return outstanding; } |
printBanner(); //추출한 함수가 반환한 값을 원래 변수에 저장한다. let outstanding = calculateOutstanding(invoice); function calculateOutstanding(invoice){ let outstanding = 0; for(const o of invoice.orders){ outstanding += o.amount; } return outstanding; } |
//마지막으로 반환 값의 이름을 코딩 스타일에 맞게 변경 const outstanding = calculateOutstanding(invoice); function calculateOutstanding(invoice){ let result = 0; for(const o of invoice.orders){ result += o.amount; } return result; } |
function printOwing(invoice){ printBanner(); const outstanding = calculateOutstanding(invoice); recordDueDate(invoice); printDetails(invoice, outstanding); function calculateOutstanding(invoice){ let result = 0; for(const o of invoice.orders){ result += o.amount; } return result; } function recordDueDate(invoice) { const today = Clock.today; invoice.dueDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 30); } function printDetails(invoice, outstanding) { console.log(`고객명 : ${invoice.customer}`); console.log(`채무액 : ${outstanding}`); console.log(`마감일 : ${invoice.dueDate.toLocaleDateString()}`); } function printBanner() { console.log("******************"); console.log("**** 고객 채무 ****"); console.log("******************"); } } |
값을 반환할 변수가 여러 개라면, 추출할 코드를 재구성하는 식으로 처리한다.
하나의 함수가 하나의 값을 반환하는 방식으로 여러 함수로 재구성한다.
'IT책, 강의 > 리팩터링' 카테고리의 다른 글
06 - 기본적인 리펙터링 - 변수 추출하기 (0) | 2023.07.16 |
---|---|
06 - 기본적인 리펙터링 - 함수 인라인하기 (0) | 2023.07.15 |
04 - 테스트 구축하기 (1) | 2023.07.12 |
03 - 코드에서 나는 악취 (0) | 2023.07.10 |
02 - 리팩터링 원칙 - 02 (0) | 2023.07.08 |