[Typescript] 객체지향 프로그래밍 (Object Oriented Prog-)

OOP

프로그램 개발을 유연하게 하고, 변경이 용이하다

개발과 보수가 간편해진다.

직관적인 코드분석이 가능해진다.

 

강한 응집력과 약한 결합력 지향

응집력은 같은 로직은 한곳으로 응집되며, 각각의 로직들은 서로 분리되어 결합이 약해지는 것이 중요하다.

 

클래스 요소

• 멤버
• 필드
• 생성자 메소드

 

인스턴스

new 연산자에 의해 생성된 객체를 의미한다.

 

예제 코드

class Person {
  name: string;

  constructor(name: string) {
    this.name = name;
  }

  // "my name is" + this.name을 출력하는 say() 함수를 완성하세요.
  say() {
    console.log(`my name is ${this.name}`);
  }
}

// Person 클래스의 인스턴스를 생성하여 "my name is 엘리스"가 출력되도록 say() 함수를 호출하세요.
const p = new Person('엘리스');
p.say();

class Person은 클래스이며, const p는 인스턴스이다.

 

 

 

접근제어자 

속성 또는 메소드로의 접근을 제한하기 위해 사용한다.

• public : 자유롭게 접근 가능.
• protected : 멤버가 포함된 클래스와, 그 하위 클래스를 제외한 외부에서의 접근을 막는다. 
• private : 클래스 외부에서의 접근을 막는다. 내부에서 접근 가능.

 

 

상속

상위 클래스의 기능을 재사용, 확장하여 새로운 클래스를 만들 수 있다.

• extends 키워드를 이용하면 상위 클래스에서 하위 클래스를 파생시켜 만들 수 있다.
• Animal이 상위 클래스(기초 클래스)라고 하고 Cat 또는 Dog 클래스는 하위 클래스이다. 

 

 

---

 

 

접근제어자

• 상위 클래스 Animal을 상속받아 하위 클래스 Dog가 생겨났다.
• Dog 클래스에서 super( ) 연산을 통해 상위 클래스 Animal의 name 변수에 접근하려고 한다.
• 이때 name은 public 또는 protected 여야 하위 클래스에서 상위 클래스의 변수로 접근이 가능하다. 
• 만약 private로 지정하고자 한다면, name에 접근할 수 있는 메서드(getter와 setter)를 만들어서 사용하면 된다.

 

class Animal {
  // 코드가 정상 동작 할수 있게 접근제어자를 수정해주세요.
  protected name: string

  constructor(name: string) {
    this.name = name;
  }
}

class Dog extends Animal {
  constructor(name: string) {
    super(name);    // 인자가 여러개면, super(name, age, email) 이런식으로 사용
  }
  
  makeSound() {
    console.log(this.name + " 멍멍!!")
  }
}

const dog = new Dog("진돗개")
dog.makeSound() // 진돗개 멍멍!! 출력

 

getter / setter

클래스 속성에 직접 접근하여 값을 수정하거나 읽는 것을 막기 위한 것이다.

속성에 직접 접근하여 수정하면 데이터 무결성이 깨질 수 있다. (캡슐화)

 

 

readonly

속성을 읽기 전용으로 설정해 변경할 수 없게 만든다.

선언될 때나 생성자에서 값을 설정하면 이후 수정할 수 없다.

 

static

각 인스턴스가 아닌 클래스 자체에서 보이는 전역 멤버를 생성한다.

범용적으로 사용되는 값에 static을 설정한다.

클래스 명 앞에 static 키워드를 붙여 static 멤버에 접근할 수 있다.

ES6에서는 메소드 전용속성에는 선언이 안되었으나 타입스크립트에서는 사용할 수 있다.

 

 

origin을 static으로 선언한 결과, 클래스 외부에서 origin 값을 변경할 수 있게 됨.

class Grid {
  // origin 필드를 전역 멤버로 선언하기 위해 static 사용
  static origin = { x:0, y:0 }
  
  calculateDistance(): void {
    console.log(Grid.origin.x * Grid.origin.y);
  }
}

const grid = new Grid();

// 외부에서 Grid origin 값 변경
Grid.origin = { x:3, y:3 } 
grid.calculateDistance(); // "9" 출력

 

 

 

---

 

추상 클래스

추상 클래스는 다른 클래스들이 파생될 수 있는 기초 클래스이다.

• 직접 인스턴스화 할 수 없다.
• abstract 키워드는 추상 클래스는 추상 메서드를 정의하는 데에 사용된다.
• 추상 메소드는 클래스에 구현되어 있지 않고, 반드시 파생된 클래스에서 구현해야 한다.

 

템플릿 메서드 패턴

추상클래스를 활용한 디자인패턴이다.

• 프로그램의 일부분을 서브 클래스로 캡슐화하여 전체 구조를 바꾸지 않고 특정 단계의 기능을 바꾸는 패턴.
• 전체적인 알고리즘은 상위 클래스에서 구현하고, 다른 부분(세밀한 부분)은 하위 클래스에서 구현한다.
• 전체 구조는 유사하지만 부분적으로 다른 구문으로 구성된 메소드의 코드 중복을 최소화할 수 있다.

 

예제 코드

• 추상클래스 Animal은 인스턴스화 불가능하므로, extends로 상속된 하위 클래스 Dog를 이용해 인스턴스화 할 수 있다.
• 추상메서드 makeSound( ) 는 하위 클래스에서 반드시 구현되어져야 한다.
• name은 protected 접근자를 사용하므로, super를 통해 접근할 수 있다.

abstract class Animal {
  protected name: string;

  constructor(name: string) {
    this.name = name;
  }

  abstract makeSound(): void;
}

class Dog extends Animal {
  // constructor를 구현
  constructor(name: string) {
    super(name);
  }
  // 추상메소드 makeSound()를 Dog 클래스 내부에서 구현
  // makeSound() 메소드에 console.log를 구현
  makeSound(): void {
    console.log(this.name + " " + '멍멍!!');
  }
}

// 클래스 name필드에 값 "진돗개"를 할당해주세요
const dog = new Dog('진돗개');
dog.makeSound(); // 진돗개 멍멍!!