포맷팅

포맷팅은 주관적입니다. 여기서 언급하는 많은 규칙과 마찬가지로 반드시 따라야 할 엄격한 기준은 없습니다. 핵심은 포맷팅을 두고 논쟁하지 않는 것입니다. 다양한 자동화 도구를 사용하세요. 포맷팅 논의로 엔지니어의 시간과 비용을 낭비하는 것은 자원 낭비입니다.

자동 포맷팅 범위에 포함되지 않는 요소(들여쓰기, 탭 대 공백, 작은따옴표 vs 큰따옴표 등)에 대한 가이드는 본 문서를 참조하세요.

대소문자 규칙 일관성 유지

JavaScript는 타입이 없는 언어이므로 변수/함수의 대소문자 규칙이 중요한 의미를 전달합니다. 이러한 규칙은 주관적이므로 팀 단위로 결정할 수 있으나, 일관성 있는 적용이 가장 중요합니다.

나쁜 사례:

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 {}

좋은 사례:

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 {}

함수 호출자와 피호출자는 인접하게 배치해야 함

함수 A가 다른 함수 B를 호출할 경우, 두 함수를 소스 파일 내에서 수직적으로 가깝게 배치해야 합니다. 이상적으로는 호출자를 피호출자 바로 위에 위치시키세요. 신문 읽듯이 위에서 아래로 코드를 읽는 일반적인 습관에 맞춰 구성하면 코드 가독성이 개선됩니다.

나쁜 사례:

class PerformanceReview {
  constructor(employee) {
    this.employee = employee;
  }

  lookupPeers() {
    return db.lookup(this.employee, "peers");
  }

  lookupManager() {
    return db.lookup(this.employee, "manager");
  }

  getPeerReviews() {
    const peers = this.lookupPeers();
    // ...
  }

  perfReview() {
    this.getPeerReviews();
    this.getManagerReview();
    this.getSelfReview();
  }

  getManagerReview() {
    const manager = this.lookupManager();
  }

  getSelfReview() {
    // ...
  }
}

const review = new PerformanceReview(employee);
review.perfReview();

좋은 사례:

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");
  }

  getManagerReview() {
    const manager = this.lookupManager();
  }

  lookupManager() {
    return db.lookup(this.employee, "manager");
  }

  getSelfReview() {
    // ...
  }
}

const review = new PerformanceReview(employee);
review.perfReview();