[타입스크립트] 클래스

타입스크립트에서 클래스 만들기

타입스크립트

class Player {
  constructor(
    private firstName:string,
    private lastName:string,
    public nickName:string
  ){}
}

const nico = new Player('nico', 'las', '니꼬')

자바스크립트

"use strict";
class Player {
  constructor(firstName, lastName, nickname) {
    this.firstName = firstName;
    this.lastName = lastName;
    this.nickName = nickname;
  }
}

const nico = new Player('nico', 'las', '니꼬');

타입스크립트에서 접근제어자

타입스크립트에 선언된 속성 firstName, lastNmae, nickName 앞에는 데이터의 접근을 제어하거나 공개할수 있도록 선언하는 키워드가 있다. private 키워드를 가진 속성은 열람이 불가능하고 public 키워드를 가진 속성만 해당 프로퍼티를 열람할 수 있다.

class Player {
  constructor(
    private firstName:string,
    private lastName:string,
    public nickName:string
  ){}
}

const nico = new Player('nico', 'las', '니꼬')

console.log(nico.lastName) // lastName은 공개할 수 없는 private 데이터이므로 에러발생
console.log(nico.nickName) // nickName은 공개할 수 있는 public 데이터이므로 'nico'라는 문자열이 콘솔창에 출력된다

프로퍼티뿐만아니라 메서드에서도 private, public 키워드를 지정할 수 있다

class Player {
  constructor(
    private firstName:string,
    private lastName:string,
    public nickName:string
  ){}
  // private 접근 제어자가 있는 메서드
  private getFullName(){
    return `${this.firstName} ${this.lastName}`
  }
}

const nico = new Player('nico', 'las', '니꼬')

console.log(nico.lastName) // lastName은 공개할 수 없는 private 데이터이므로 에러발생
console.log(nico.nickName) // nickName은 공개할 수 있는 public 데이터이므로 'nico'라는 문자열이 콘솔창에 출력된다

 

추상클래스

class 앞에 키워드 abstract를 붙여주면 추상클래스가 된다

추상클래스란 다른 클래스가 상속받을 수 있는 클래스를 말한다

하지만 추상클래스로는 새로운 인스턴스를 만들 수 없다

예시

// 추상클래스
abstract class User {
  constructor(
      private firstName:string,
      private lastName:string,
      public nickName:string
  ){}
}

// 추상클래스 User를 상속받는 클래스 Player
class Player extends User {
  ...생략
}

// 추상클래스로 만들었기 때문에 새로운 인스턴스를 만들 수 없다
const nico = new User('nico', 'last', '니꼬') // 에러 발생

 

추상메서드와 protected

추상 클래스 안에 들어가 있는 일반 메서드

abstract class User {
  constructor(
      private firstName:string,
      private lastName:string,
      public nickName:string
  ){}
  // 추상클래스 안에 들어가 있는 일반 메서드
  getFullName(){
    return `${this.firstName} ${this.lastName}`
  }
}

class Player extends User {

}

const nico = new Player('nico', 'las', '니꼬')

추상 클래스 안에 들어가 있는 추상 메서드

참고

* call signature: 함수가 선언되기 전에 타입을 미리 지정해 여러번 재사용할 수 있도록 하는 것을 call signature라고 한다 (일종의 타입 템플릿으로 함수를 어떻게 호출해야하는 것인지 알려준다)

* void: 아무것도 리턴하지 않는 함수에 자동으로 부여되는 타입이다. void를 따로 지정해줄 필요는 없다.

 

추상 클래스 User 안에 추상 메서드 getNickName을 만든다. 추상 메서드를 만들기 위해서는 메서드의 call signature만 적어주어야 한다. 이때 추상 클래스 User를 상속받는 클래스 Player에 추상 메서드를 넣어주어야 한다.

abstract class User {
  constructor(
      private firstName:string,
      private lastName:string,
      private nickName:string
  ){}
  // 메서드의 call signature만 있을때 추상 메서드가 된다
  abstract getNickName():void
}

// 추상 클래스 User를 상속받는 클래스 Player에 추상메서드를 넣어주어야 한다
class Player extends User { // 에러발생: 추상메서드 선언 필요

}

const nico = new Player('nico', 'las', '니꼬')

에러 내용

에러를 해결하기 위해 getNickName 함수를 클래스 Player에 선언해준다.

abstract class User {
  constructor(
      private firstName:string,
      private lastName:string,
      private nickName:string
  ){}
  // 메서드의 call signature만 있을때 추상 메서드가 된다
  abstract getNickName():void
}

// 클래스 Player는 추상메서드를 가지고 있는 클래스 User를 상속받기 때문에 추상메서드를 내부에 선언해주어야 한다.
class Player extends User {
  getNickName() {
    console.log(this.nickName) // 에러발생: nickName은 private
  }
}

const nico = new Player('nico', 'las', '니꼬')
nico.getNickName() // 에러발생: nickName은 private

 

• public (default) : 공개된 데이터로 프로퍼티와 메서드에 접근제어자 키워드가 없다면 public을 의미한다
• private: 데이터를 자식클래스에 넘겨줄 수 없고 인스턴스 밖에서 사용할수 없게 된다 (private 데이터를 선언한 클래스 내부에서만 사용할 수 있다)
• protected: 데이터를 자식클래스에 넘겨줄 수 있고 인스턴스 밖에서 사용할수 있다 (protected 데이터를 선언한 클래스 내부뿐만이 아니라 해당 클래스를 상속받은 클래스와 상속받은 클래스로 만든 인스턴스에서 사용할 수 있다)

abstract class User {
  constructor(
      private firstName:string,
      private lastName:string,
      protected nickName:string // private에서 protected로 변경
  ){}
  abstract getNickName():void
}

class Player extends User {
  getNickName() {
    console.log(this.nickName) // 접근가능
  }
}

const nico = new Player('nico', 'las', '니꼬')
nico.getNickName() // 접근가능

 

예제

// Words의 타입: string만을 프로퍼티로 가지는 오브젝트
// [key:string]: ㅛ프로퍼티에 대해 미리 알진 못하지만 타입만 알고 있을때 쓴다
type Words = {
  [key:string]: string
}

class Dict {
  // constructor에서 직접 초기화 되지 않는 프로퍼티
  // words를 initializer 없이 선언
  private words: Words
  // ??? constructor에서 수동으로 초기화
  constructor(){
    this.words = {}
  }
  // 클래스 Word를 타입으로 사용
  add(word:Word) {
    if(this.words[word.term] === undefined) {
      this.words[word.term] = word.def
    }
  }
  def(term:string) {
    return this.words[term]
  }
  delete(term:string) {
    delete this.words[term]
  }
}

class Word {
  constructor(
    public term: string,
    public def: string
  ){}
}

const kimchi = new Word('kimchi', '한국의 음식')
console.log(kimchi)

const dict = new Dict()
console.log(dict)

// kimchi = {
//   "term": "kimchi",
//   "def": "한국의 음식"
// } 
dict.add(kimchi)
console.log(dict)

dict.def('kimchi') // '한국의 음식'

dict.delete('kimchi')
console.log(dict)