- 클래스 메서드
- 독립 함수와 동일한 방식의 메서드
- 매개변수 타입이나 기본 값을 지정하지 않으면 any 타입을 기본 값으로 가진다.
- 메서드를 호출하려면 허용 가능한 수의 인수가 필요하다. 재귀 함수가 아니라면 대부분 반환 타입 유추 가능
- 메서드 호출 시 올바른 타입의 인수가 올바른 수로 제공되는지 확인하기 위해 타입 검사 실시
- 클래스 속성(attribute)
- 클래스의 속성을 읽거나 쓰려면 명시적으로 선언해야 한다.
- 클래스 속성 - method
- 모든 prop은 초기화 또는 정의해야 한다. (! 또는 ?는 제외)
- 클래스 속성 - 초기화 검사
- StrictNullCheck On에서 TS는 undefined 타입으로 선언된 각 속성이 생성자에서 할당되었는지 확인
- 초기화하지 않았다는 것은 undefined이므로 생성자에서라도 초기화 해야 한다.
- StrictNullCheck가 없다면 타입 시스템이 undefined 값에 접근할 수 없다고 말할지라도 클래스 인스턴스는 undefined 값에 접근할 수 있다.
- 클래스 속성 - 확실하게 할당된 속성
- 엄격한 초기화 검사를 적용하면 안되는 속성인 경우 변수 이름 뒤에 ‘!’를 추가해 검사를 비활성화하도록 하기
- TS 속성이 처음 사용되기 전에 undefined 값이 할당됨
- 또는 생성자에서 초기화
- constructor(변수: string[]) { this.변수 = 변수; }
- 클래스 속성 - 선택적 속성
- 선언된 속성 이름 뒤에 ?를 추가해 속성을 옵션으로 선언
- class 클래스 { 변수?: string; }
- ‘ | undefined’ 를 포함하는 유니언 타입과 동일하게 작동
- 선언된 속성 이름 뒤에 ?를 추가해 속성을 옵션으로 선언
- 클래스 속성 - 읽기 전용 속성 (readonly)
- 선언된 속성 이름 앞에 readonly 키워드를 추가해 속성을 읽기 전용으로 선언
-
class 클래스 { readonly 변수: string; constructor(변수: string) { this.변수 = 초기화값; }
-
- readonly로 선언된 속성은 선언된 위치 또는 생성자에서 초기값만 할당할 수 있다. (다른 모든 위치는 읽을 수 만 있고 쓸 수 없음)
- readonly는 타입 시스템에만 존재하고 JS로 컴파일할 때는 삭제된다.
- 선언된 속성 이름 앞에 readonly 키워드를 추가해 속성을 읽기 전용으로 선언
- 클래스 속성 - readonly literal
- 값의 타입이 가능한 좁혀진 리터럴 타입으로 유추
- ex)
class 클래스 { readonly 변수1: string = 초기화값; readonly 변수2 = "Hello"; // Literal Type } // 변수1의 타입은 string // 변수2의 타입은 "Hello"
- 값의 타입이 가능한 좁혀진 리터럴 타입으로 유추
- 타입으로서의 클래스
- TS는 클래스의 동일한 멤버를 모두 포함하는 모든 객체 타입을 클래스에 할 수 있는 것으로 간주
- TS의 구조적 타이핑이 선언되는 방식이 아니라 객체의 형태만 고려하기 때문
- 클래스와 인터페이스 (implements)
- 클래스 이름 뒤에 implements 키워드와 인터페이스 이름을 추가하면 클래스의 인스턴스가 해당 인터페이스를 준수한다고 선언할 수 있다.
- class 클래스 implements 인터페이스 { … }
- 부모 클래스는 선언만 하며, 자식 클래스는 부모의 기능을 다시 정의해서 사용해야 한다. (오버라이딩)
- 클래스 이름 뒤에 implements 키워드와 인터페이스 이름을 추가하면 클래스의 인스턴스가 해당 인터페이스를 준수한다고 선언할 수 있다.
- 클래스와 인터페이스 - 다중 인터페이스 구현
- 클래스에 구현된 인터페이스 목록은 개수 제한없이 인터페이스를 사용할 수 있다. (다 상속 가능)
- class 클래스 implements 인터페이스1, 인터페이스2 { … }
- 하지만 두 개의 충돌하는 인터페이스를 구현하는 클래스를 선언하려고 하면 클래스에 하나 이상의 타입 오류 발생
- 클래스에 구현된 인터페이스 목록은 개수 제한없이 인터페이스를 사용할 수 있다. (다 상속 가능)
- 클래스 확장 (extends)
- 다른 클래스를 확장하거나 하위 클래스를 만드는 자바스크립트 개념에 타입 검사 추가
- class 하위클래스 extends 기본클래스 { … }
- 기본 클래스에 선언된 모든 메서드나 속성은 하위 클래스(파생 클래스) 에서 사용 가능
- 부모 클래스에서 선언과 정의를 모두하고, 자식 클래스는 오버라이딩 할 필요없이 부모 클래스의 기능을 사용할 수 있다.
- extends는 클래스 한 개만 상속받을 수 있다.
- 다른 클래스를 확장하거나 하위 클래스를 만드는 자바스크립트 개념에 타입 검사 추가
- 클래스 확장 - 재정의(override)된 생성자
- 하위 클래스가 자체 생성자를 선언하면 super 키워드를 통해 기본 클래스 생성자를 호출해야 함
-
class 하위클래스 extends 기본클래스 { constructor() { super(값); } }
-
- 하위 클래스 생성자는 모든 매개변수 선언 가능
- 하위 클래스가 자체 생성자를 선언하면 super 키워드를 통해 기본 클래스 생성자를 호출해야 함
- 클래스 확장 - 재정의(override)된 메서드
- 하위 클래스는 기본 클래스와 동일한 이름으로 새 메서드를 다시 선언할 수 있다.
- 클래스 확장 - 재정의된 속성
- 하위 클래스는 동일한 이름으로 기본 클래스의 속성 (변수)을 명시적으로 다시 선언할 수 있다. (하위는 기본과 구조적으로 일치해야함)
- 추상 클래스 (Abstract Class)
- 일부 메서드를 구현하지 않고 하위 클래스가 해당 메서드를 제공할 것을 예상하고 기본 클래스를 만드는 방법
-
abstract class 추상클래스 { readonly name: string; constructor(name: string) { this.name = name; } // 아래 코드 처럼 본체는 없음 abstract 추상메서드(): string[]; } class 하위클래스 extends 추상클래스 { 추상메서드() { // 구현코드 } }
-
- 추상 클래스를 상속 받는 하위 클래스는 꼭 추상 메서드를 재정의 해야 한다. (override 안하면 error 발생)
- 추상 클래스는 객체 생성이 불가능하고, 자식 클래스를 대상으로 객체 생성 한다.
- 추상 클래스는 추상 메서드를 가진 클래스를 말하며 일반 멤버(변수, 메서드)도 가질 수 있다. 하지만 한 개 이상의 추상 메서드는 반드시 존재해야함!
- 일부 메서드를 구현하지 않고 하위 클래스가 해당 메서드를 제공할 것을 예상하고 기본 클래스를 만드는 방법
- 멤버 접근성
- TS의 멤버 접근성은 클래스 멤버의 선언 이름 앞에 아래 키워드 중 하나를 추가한다.
- public (기본값)
- 모든 곳(외부, 하위) 에서 접근 가능
- protected
- 해당 클래스 내부 또는 하위 클래스에서만 접근 가능
- private
- 해당 클래스 내부에서만 접근 가능
- 멤버 접근성 - 정적 필드 제한자 (static)
- 클래스를 통해 인스턴스를 생성할 필요 없이 클래스의 속성이나 메서드를 사용하고자 할 때 static 키워드를 사용하여 속성이나 메서드 정의
- ex) protected static readonly 변수: ‘aaa’;
- static 키워드를 사용하여 선언된 변수, 함수는 정적 변수, 정적 함수라고 말한다. 이는 클래스에 속하는 변수와 함수로 호출하기 위한 객체가 필요하지 않고 클래스에서 바로 호출 가능하다. (클래스에서 점 표기법으로 직접 호출가능)
- 객체에서(인스턴스 생성) 정적 변수, 정적 함수 호출은 불가능
- var 클래스2 = new 클래스();
- 클래스2.정적함수(); → 에러 발생!
- 클래스를 통해 인스턴스를 생성할 필요 없이 클래스의 속성이나 메서드를 사용하고자 할 때 static 키워드를 사용하여 속성이나 메서드 정의
728x90
'JS & TS > TypeScript' 카테고리의 다른 글
[TypeScript] Generic (0) | 2024.02.15 |
---|---|
[TypeScript] 타입 제한자 (0) | 2024.02.15 |
[TypeScript] Interface (0) | 2024.02.13 |
[TypeScript] Array, Tuple (0) | 2024.02.13 |
[TypeScript] Function (0) | 2024.02.13 |