본문 바로가기
script/Typescript

typescript Classes(+abstract class, abstract method)

by devved 2023. 1. 8.
반응형

Class

// Classes
class Player {
    constructor(
        private firstName: string, // private or public property 만들 수 있음
        private lastName :string, 
        public nickname: string
    ) {}
}
/* javascript
class Player {
    constructor(firstName, // private or public property 만들 수 있음
    lastName, nickname) {
        this.firstName = firstName;
        this.lastName = lastName;
        this.nickname = nickname;
    }
}
*/

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

nico.firstName // error (접근불가)
nico.nickname // 접근가능

 

Abstract Class(추상클래스)

// Abstract Class(추상클래스)
// 다른 클래스가 상속받을 수 있는 클래스(오직 다른 곳에서 상속받을 수 만!있음 => 인스턴스생성불가)
abstract class User {
    constructor(
        private firstName: string, 
        private lastName :string, 
        public nickname: string
    ) {}
    // 메서드
    private getFullName() {
        return `${this.firstName} ${this.lastName}`
    }
    getNickname() {
        return `${this.nickname}`
    }
}

// 추상클래스를 상속받을 수는 있지만
class Player extends User {

}

// 아래와 같이 직접 인스턴스를 만들지는 못함
const nico = new User('nico', 'las', '니꼬');  // error 
const siha = new Player('siha', 'las', '시하');  // 인스턴스 생성 가능

// 메서드 사용 
siha.getFullName()  // private 메서드로 사용할 수 없음
siha.getNickname()

 

추상 메서드, private, protected, public

/* 
private => 인스턴스 밖 접근불가, 자식클래스에서 접근불가 (+추상클래스일 경우 인스턴스화 불가)
protected => 인스턴스 밖 접근 불가, 자식클래스에서 접근가능
public => 외부의 모든 곳에서 사용가능
*/

abstract class User {
    constructor(
        private firstName: string, 
        private lastName :string, 
        protected nickname: string
    ) {}
    private getFullName() {
        return `${this.firstName} ${this.lastName}`
    }
    // 추상 메서드  
    // -> User를 상속받는 애들은 모두 구현해야하는 메서드 
    abstract getNickname():void 
}

// getNickname를 꼭 구현해야만 함(User를 상속받아서)
class Player extends User {
    getNickname() {
        console.log(this.nickname); // nickname 은 protected로 자식클래스에서 사용가능
    }
}

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

nico.getNickname() 
nico.getFullName() // private으로 사용할 수 없음

 

hashmap 사용하여 사전만들어보기

// hashmap
type Words = {
    // key type 지정해주기 [변수명: type]
    [key: string]:string
}

class Dict {
    private words : Words
    // word 수동으로 초기화 해주기 왜?! 
    constructor() {
        this.words = {};
    }
    add(word:Word) { // 클래스를 타입으로 쓰는 중(word 파라미터가 Word의 인스턴스이기를 바라면)
        if (this.words[word.term] === undefined) {
            this.words[word.term] = word.def;
        }
    }
    def(term:string){
        return this.words[term]
    }
	// 수정 직접 만들어보기
		update(word:Word) {
	        if (this.words[word.term] !== undefined) {
	            this.words[word.term] = word.def;
				  }
		}
}

class Word {
    constructor(
        public term: string, // readonly 추가해주면 읽을 수 있지만 수정 불가
        public def: string
    ) {}
}

const kimchi = new Word('kimchi', '한국의 음식');
const hot_kimchi = new Word('kimchi', '매워요');

const dict = new Dict();

dict.add(kimchi);
dict.def('kimchi'); // '한국의 음식'
dict.update(hot_kimchi)
dict.def('kimchi'); // '매워요'
반응형

'script > Typescript' 카테고리의 다른 글

TS setting  (0) 2023.01.10
Typescript 인터페이스  (0) 2023.01.09
Typescript polymorphism, generic  (0) 2023.01.08
Typescript call signatures, overloading  (0) 2023.01.08
Typescript의 Type 정의  (0) 2023.01.08