[JS: CLEAN CODE] 함수
🧐 들어가기
클린코드의 함수에서 가장 중요한 세 가지는 다음과 같습니다!
1. 길이가 짧고
2. 이름이 좋고
3. 체계가 잡힌
한 가지만 해라
하나의 함수는 하나의 행동만 정의해야 한다
하나의 행동만 해야 함수를 작성하는 것, 테스트하는 것 그리고 이해하는 것이 쉬워진다.
하나의 행동만 하는지 어떻게 판단할까?
함수의 핵심 기능을 파악해서, 이 함수의 추상화 수준이 하나인지 판단하는 것이다!
명령형 프로그래밍보다 함수형 프로그래밍을 지향하세요
JavaScript는 Haskell처럼 함수형 프로그래밍 언어
는 아니지만 함수형 프로그래밍처럼 작성할 수 있다.
함수형 언어는 더 깔끔하고 테스트하기 쉽다.
선연형 프로그래밍 vs 명령형 프로그래밍
- 선언형 프로그래밍은 어떤 방법으로 해야하는지 보다는 무엇을 얻을지를 설명하는 방식이다.
- 함수형 프로그래밍 : 순수 함수를 조합하고 소프트웨어를 만드는 방식을 의미
- 명령형 프로그래밍은 프로그래밍의 상태와 상태를 변경시키는 구문의 관점에서 연산을 설명하는 방식이다.
- 절차지향 프로그래밍: 수행되어야 할 연속적인 계산 과정을 포함하는 방식 (C, C++)
- 객체지향 프로그래밍: 객체들의 집합으로 프로그램의 상호작용을 표현 (C++, Java, C#)
선언형: 알고리즘을 명시하지 않고, 목표를 명시한다
명령형: 알고리즘을 명시하고, 목표는 명시 하지 않는다
예시
공통
const programmerOutput = [
{
name: 'Uncle Bobby',
linesOfCode: 500
}, {
name: 'Suzie Q',
linesOfCode: 1500
}, {
name: 'Jimmy Gosling',
linesOfCode: 150
}, {
name: 'Gracie Hopper',
linesOfCode: 1000
}
];
안좋은 예
let totalOutput = 0;
for (let i = 0; i < programmerOutput.length; i++) {
totalOutput += programmerOutput[i].linesOfCode;
}
좋은 예
const totalOutput = programmerOutput
.map(programmer => programmer.linesOfCode)
.reduce((acc, linesOfCode) => acc + linesOfCode, INITIAL_VALUE);
조건문 작성을 피하세요
조건문 작성을 피하라는 것은 매우 불가능한 일로 보입니다.
이 얘기를 처음 듣는 사람들은 대부분 "If문 없이 어떻게 코드를 짜나요?"라고 말합니다.
하지만 다형성
을 이용한다면 동일한 작업을 수행할 수 있습니다.
두번째 질문은 보통 "네 좋네요 근데 내가 왜 그렇게 해야하나요?"이죠.
그에 대한 대답은, 앞서 우리가 공부했던 clean code 컨셉에 있습니다.
함수는 단 하나의 일만 수행하여야 합니다.
당신이 함수나 클래스에 if문을 쓴다면 그것은 그 함수나 클래스가 한가지 이상의 일을 수행하고 있다고 말하는 것과 같습니다.
기억하세요, 하나의 함수는 딱 하나의 일만 해야합니다.
예시
안좋은 예
class Airplane {
// ...
getCruisingAltitude() {
switch (this.type) {
case '777':
return this.getMaxAltitude() - this.getPassengerCount();
case 'Air Force One':
return this.getMaxAltitude();
case 'Cessna':
return this.getMaxAltitude() - this.getFuelExpenditure();
}
}
}
좋은 예
class Airplane {
// ...
}
class Boeing777 extends Airplane {
// ...
getCruisingAltitude() {
return this.getMaxAltitude() - this.getPassengerCount();
}
}
class AirForceOne extends Airplane {
// ...
getCruisingAltitude() {
return this.getMaxAltitude();
}
}
class Cessna extends Airplane {
// ...
getCruisingAltitude() {
return this.getMaxAltitude() - this.getFuelExpenditure();
}
}
과도한 최적화를 지양하세요
최신 브라우저들은 런타임에 많은 최적화 작업을 수행합니다.
대부분 당신이 코드를 최적화 하는 것은 시간낭비일 가능성이 많습니다.
예시
안좋은 예
// 오래된 브라우저의 경우 캐시되지 않은 `list.length`를 통한 반복문은 높은 코스트를 가졌습니다.
// 그 이유는 `list.length`를 매번 계산해야만 했기 때문인데, 최신 브라우저에서는 이것이 최적화 되었습니다.
for (let i = 0, len = list.length; i < len; i++) {
// ...
}
좋은 예
for (let i = 0; i < list.length; i++) {
// ...
}
정리하지 않은 문항 : 12, 13 (왜 그렇게 해야해?) / 18
Author And Source
이 문제에 관하여([JS: CLEAN CODE] 함수), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@ingong/JS-CLEAN-CODE-함수저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)