포맷팅에 관한 과도한 논쟁은 낭비라고 생각한다.
이미 좋은 포맷팅 도구가 많기 때문이다.
하지만 아래의 몇 가지 기본적인 지침은 따르는 것이 좋다.
1. 일관된 대소문자를 사용한다.
// BAD
const DAYS_IN_WEEK = 7;
const daysInMonth = 30;
const songs = ['Back In Black', 'Stairway to Heaven', 'Hey Jude'];
const Artists = ['ACDC', 'Led Zeppelin', 'The Beatles'];
function eraseDatabase() {}
function restore_database() {}
class animal {}
class Alpaca {}
// GOOD
const DAYS_IN_WEEK = 7;
const DAYS_IN_MONTH = 30;
const songs = ['Back In Black', 'Stairway to Heaven', 'Hey Jude'];
const artists = ['ACDC', 'Led Zeppelin', 'The Beatles'];
function eraseDatabase() {}
function restoreDatabase() {}
class Animal {}
class Alpaca {}
2. 함수 호출자와 호출 대상은 가깝게 위치시킨다.
- 이상적으론 호출자를 호출대상 바로 위에 위치시키는 것이다.
- 우리는 코드를 위에서 아래로 읽기 때문이다.
class PerformanceReview {
constructor(employee) {
this.employee = employee;
}
lookupPeers() {
return db.lookup(this.employee, 'peers');
}
lookupManager() {
return db.lookup(this.employee, 'manager');
}
perfReview() { // 찾기 힘든 위치
this.getPeerReviews();
this.getManagerReview();
this.getSelfReview();
}
}
const review = new PerformanceReview(user);
review.perfReview();
// GOOD
class PerformanceReview {
constructor(employee) {
this.employee = employee;
}
perfReview() { // 찾기 쉬운 위치
this.getPeerReviews();
this.getManagerReview();
this.getSelfReview();
}
getPeerReviews() {
const peers = this.lookupPeers();
// ...
}
lookupPeers() {
return db.lookup(this.employee, 'peers');
}
}
'프론트엔드 > JavaScript' 카테고리의 다른 글
[JavaScript] axios와 fetch 차이 (0) | 2021.12.09 |
---|---|
[JavaScript] Clean Code - 11. 주석(Comments) (0) | 2021.08.28 |
[JavaScript] 클린 코드 - 9. 에러 처리 (0) | 2021.08.28 |
[JavaScript] 클린 코드 - 8. 동시성 (Concurrency) (0) | 2021.08.26 |
[JavaScript] 클린 코드 - 7. 테스팅 (0) | 2021.08.26 |