📌프론트엔드 예시로 살펴보는 SOLID 원칙 3) Interface Segregation Principle (인터페이스 분리 원칙), Dependency Inversion Principle (의존 역전 원칙)

미션

저번 포스팅에 이어 또다른 미션이 전달되었다.

📌프론트엔드 예시로 살펴보는 SOLID 원칙 2)개방-폐쇄 원칙, 리스코프 치환 원칙

희박한 확률로 냐옹이도 나왔으면 좋겠어요.
냐옹이가 나오면 대화도 나누고, 같이 산책도 갈 수 있어요.
고양이 종류가 시즌 별로 바뀌고, 새로 추가될 수 있으니 참고해주세요!

STEP1. 요구사항 분석

저번처럼 다시 요구사항을 분석해보자.

• 고양이지만 고양이보다 더 많은 행동을 할 수 있는 냐옹이가 추가되었다.
• 고양이 종류가 계속 바뀔 수 있다.(코드에서 확장성을 고려해야 한다.)

STEP2. 할 일 나누기

• 고양이
  • 고양이 공통 data(이름, 나이, 품종?)
  • 고양이 공통 행동 method("eat", "walk", "wake", "sleep", "shower", "drink")
  • 고양이 추가 행동 method("talk", "take a stroll")
  • 고양이 공통 모양 (얼굴, 귀, 눈, 코, 수염, 입, 몸통, 꼬리)
  • 고양이별 공통 dom 이벤트(mousehover, leave, click)
  • 고양이별 모양 ( 색상, 크기 )

고양이 class

• 고양이 공통 data + 공통 행동 + 공통 모양 + 공통 dom 이벤트
• 고양이 생성 : 고양이 Class + 고양이별 모양(색상, 크기) + 고양이 추가 행동?

📑 SOLID원칙 4. 인터페이스 분리 원칙(Interface Segregation Principle)

• 한 클래스는 자신이 사용하지 않는 인터페이스는 구현하지 말아야 한다. 
• 고양이: 잠자기, 밥먹기, 자기, 일어나기, 씻기, 대화하기, 산책하기, 포켓몬 잡기
• 냐옹이: 잠자기, 밥먹기, 자기, 일어나기, 씻기, 대화하기, 산책하기, 포켓몬 잡기
• 러시안 블루: 잠자기, 밥먹기, 자기, 일어나기, 씻기
• 고양이 클래스 안에 있는 메서드를 러시안 블루는 사용하지 않는다.
  (인터페이스 분리가 어긋난 예시)

📑 SOLID원칙 5. 의존 역전 원칙(Dependency Inversion Principle )

• 의존 관계를 맺을 때, 구체적인 것 보다는 추상적인 것 즉, 변화하기 어려운 것에 의존하는 것이 낫다.
• 예를 들어 고양이가 뛰어노는 playground에 고양이를 하나씩 추가한다고 생각해보자. playground는 고양이 객체와 의존성을 가질 수 밖에 없다.

class Playground{
  getCat(){
    this.cat = new Cat();
  }
  getBlueCat(){
    this.blueCat = new BlueCat();
  }
  get냐옹(){
    this.냐옹 = new 냐옹();
  }
  play(){
    if(this.cat) this.cat.play();
    if(this.blueCat) this.blueCat.play();
    if(this.냐옹) this.냐옹.talk();
  }
}

이 때 playground가 구체적인 cat형태를 직접 호출하는 것이 아닌 추상화된 객체 형태로 다뤄 의존성을 느슨하게 하는 것을 의존 역전 원칙이라고 한다.

class Playground{
  addCat(catClass){
    this.catList.push(addCat)
  }
  playCat(catClass){
    // 이 때 냐옹이 클래스는 play의 통일성을 위해 adaptor 패턴 같은 것을 적용 할 수 있다.
    this.catList.forEach((cat) => cat.play())
  }
}

STEP3. 구현하기

• 다음 포스팅으로 계속됩니다.