Bae

[TypeScript] 객체와 클래스 본문

TypeScript

[TypeScript] 객체와 클래스

Bae:) 2022. 3. 14. 09:00

ㅁ 객체와 클래스

 - 클래스 선언문

  타입스크립트는 class, private, public, protected, implements, extend와 같은 키워드를 제공함

  다음은 클래스 선언문의 기본 형태임

class 클래스 이름 {
	[private | protected | public] 속성 이름[?]: 속성타입[...]
}
// Person1.ts
class Person1{
	name: string
    	age?: number
}

  다음 코드는 Person1 클래스에 new 연산자를 적용해 jack1이라는 이름의 Person1 타입 변수를 만든다.

  jack1은 name과 age 속성을 가지는 타입이므로 6행과 같은 코드를 작성할 수 있음

...생략...
let jack1 : Person1 = new Person1()
jack1.name = 'Jack'; jack1.age = 32
console.log(jack1)	// Person1 { name: 'Jack', age: 32 }

 

- 접근 제한자

  클래스의 속성은 public, private, protect와 같은 접근 제한자(access modifier)를 이름 앞에 붙일 수 있음

  만약 생략하면 모두 public으로 간주함

 

- 생성자

  타입스크립트 클래스는 constructor라는 이름의 특별한 메소드를 포함하는데, 이를 생성자(constructor)라고 함

  2행과 같은 형태로 클래스의 속성(name, age)을 선언할 수 있음

// Person2.ts
class Person2{
	constructor(public name: string, public age?: number) {}
}
let jack2 : Person2 = new Person2('Jack', 32)
console.log(jack2)	// Person2 { name: 'Jack', age: 32 }

  타입스크립트는 생성자의 매개변수에 public과 같은 접근 제한자를 붙이면 해당 매개변수의 이름을 가진 속성이 클래스에 선언된 것처럼 동작함

  즉, Person2 클래스는 다음 Person3 클래스처럼 장황하게 구현된 것을 함축해서 구현한 것임

// Person3.ts
class Person3{
	name: string
    	age?: number
    constructor(name: string, age?: number){
    	this.name = name; this.age = age
    }
}
let jack3 : Person3 = new Person3('Jack', 32)
console.log(jack3)	// Person3 { name: 'Jack', age: 32 }

 

- 인터페이스 구현

  타입스크립트 클래스는 인터페이스를 구현할 수 있음

  클래스가 인터페이스를 구현할 때는 다음처럼 implemetns 키워드를 사용함

class 클래스 이름 implements 인터페이스 이름{
	...
}

  다음 코드는 IPerson4라는 이름의 인터페이스를 구현하는 예시임

  기억해 둬야 할 점은 인터페이스는 이러이러한 속성이 있어야 한다는 규약(spec)에 불과할 뿐 물리적으로 해당 속성을 만들지 않는다는 점임

  따라서 클래스 몸통에는 반드시 인터페이스가 정의하고 있는 속성을 멤버 속성으로 포함해야 함

interface IPerson4{
	name: string
    	age?: number
}

class Person4 implements IPerson4 {
	name: string
    	age: number
}

  다음 코드는 앞서 본 Person2 구현 방식(생성자와 public 키워드 사용)을 인터페이스 구현에 응용한 것임

// Person4.ts
interface IPerson4 {
	name: string
    	age?: number
}

class Person4 implements IPerson4 {
	constructor(public name: string, public age?: number) {}
}
let jack4: IPerson4 = new Person4('Jack', 32)
console.log(jack4);		// Person4 { name: 'Jack', age: 32 }

 

- 추상 클래스

  타입스크립트는 abstract 키워드를 사용해 추상 클래스를 만들 수 있음

  추상 클래스는 다음처럼 abstract 키워드를 class 키워드 앞에 붙여서 만든다.

  추상 클래스는 자신의 속성이나 메소드 앞에 abstract를 붙여 나를 상속하는 다른 클래스에서 이 속성이나 메소드를 구현하게 함

abstract class 클래스 이름 {
	abstract 속성 이름: 속성 타입
    	abstract 메소드 이름() {}
}

  다음 AbstractPerson5는 name 속성 앞에 abstract가 붙었으므로 new 연산자를 적용해 객체를 만들 수 없음

// Person5.ts
abstract class AbstractPerson5 {
	abstract name: string
    	constructor(public age?: number) {}
}

 

- 클래스의 상속

  객체지향 언어는 부모 클래스를 상속받는 상속 클래스를 만들 수 있는데, 타입스크립트는 다음처럼 extends 키워드를 사용해 상속 클래스를 만든다.

class 상속 클래스 extends 부모 클래스 { ... }

  다음 Person5 클래스는 AbstractPerson5 추상 클래스를 상속해 AbstractPerson5가 구현한 age를 얻고, AbstractPerson5를 상속받는 클래스가 구현해야 할 name 속성을 구현함

  참고로 타입스크립트에서는 부모 클래스의 생성자를 super 키워드로 호출할 수 있음

// Person5.ts
... 생략 ...
class Person5 extends AbstractPerson5 {
	constructor(public name: string, age?: number) {
    	super(age)
    }
}
let jack5: Person5 = new Person5('Jack', 32)
console.log(jack5)	// Person5 { name: 'Jack', age: 32 }

 

- static 속성

  타입스크립트 클래스는 정적인 속성을 가질 수 있음

  클래스의 정적 속성은 다음과 같은 형태로 선언함

class 클래스 이름{
	static 정적 속성 이름: 속성 타입
}

  다음 코드의 클래스A는 initValue라는 정적 속성을 가짐

  클래스의 정적 속성은 5행처럼 '클래스 이름.정적 속성 이름'형태의 점 표기법(dot notation)을 사용해 값을 얻거나 설정함

// static.ts
class A {
	static initValue = 1
}

let initVal = A.initValue	// 1

 

[출처: Do it 타입스크립트 프로그래밍]

Comments