클래스(Classes)

1. 메소드 체이닝을 사용.

사용법 : 클래스 함수에서 모든 함수의 끝에 'this'를 리턴해주는 것으로 클래스 메소드 추가로 연결 가능.

//Bad 
class Car {
  constructor() {
    this.make = 'Honda';
    this.model = 'Accord';
    this.color = 'white';
  }

  setMake(make) {
    this.make = make;
  }

  setModel(model) {
    this.model = model;
  }

  setColor(color) {
    this.color = color;
  }

  save() {
    console.log(this.make, this.model, this.color);
  }
}

const car = new Car();
car.setColor('pink');
car.setMake('Ford');
car.setModel('F-150');
car.save();

//Good
class Car {
  constructor() {
    this.make = 'Honda';
    this.model = 'Accord';
    this.color = 'white';
  }

  setMake(make) {
    this.make = make;
    // 메모: 체이닝을 위해 this를 리턴합니다.
    return this;
  }

  setModel(model) {
    this.model = model;
    // 메모: 체이닝을 위해 this를 리턴합니다.
    return this;
  }

  setColor(color) {
    this.color = color;
    // 메모: 체이닝을 위해 this를 리턴합니다.
    return this;
  }

  save() {
    console.log(this.make, this.model, this.color);
    // 메모: 체이닝을 위해 this를 리턴합니다.
    return this;
  }
}

const car = new Car()
  .setColor('pink')
  .setMake('Ford')
  .setModel('F-150')
  .save();

2. 상속보단 조합을 사용.

먼저 우리가 상속을 사용하는 이유는 무엇일까?

1. 코드를 재사용함으로써 중복을 줄인다.

2. 변화에 대한 유연성 및 확장성이 증가한다.

3. 개발 시간이 단축된다.

하지만 상속의 장점을 제대로 활용하지 못한다면,
오히려 변화에 유연성이 떨어지며, 오류를 내기 쉬운 소프트웨어가 될 수 있다.

상속의 단점 : 캡슐화를 깨뜨린다.

상위 클래스의 구현이 하위 클래스에 노출되는 상속은 캡슐화를 깨뜨린다.

하위 클래스가 상위 클래스에 강하게 의존, 결합하게 되어 변화에 대한 유연성 떨어질 수 있음.

조합 : 기존의 클래스가 새로운 클래스의 구성요소로 쓰임. "has - a" 관계.

조합을 사용하면,

1. 메소드를 호출하는 방식으로 동작하여 캡슐화를 지킴.

2. 상속을 사용하는 경우보다 기존 클래스의 변화에 영향이 적음.

//Bad

class Employee {
  constructor(name, email) {
    this.name = name;
    this.email = email;
  }

  // ...
}

// 이 코드가 안좋은 이유는 Employees가 tax data를 "가지고" 있기 때문입니다.
// EmployeeTaxData는 Employee 타입이 아닙니다.
class EmployeeTaxData extends Employee {
  constructor(ssn, salary) {
    super();
    this.ssn = ssn;
    this.salary = salary;
  }

  // ...
}

//Good

class EmployeeTaxData {
  constructor(ssn, salary) {
    this.ssn = ssn;
    this.salary = salary;
  }
  
  // ...
}

class Employee {
  constructor(name, email) {
    this.name = name;
    this.email = email;
  }

  setTaxData(ssn, salary) {
    this.taxData = new EmployeeTaxData(ssn, salary);
  }
  // ...
}

참고

상속보다는 조합(Composition)을 사용하자.
[번역판] CLEAN CODE JAVASCRIPT