반응형
오늘은 타입스크립트(TypeScript)의 객체와 타입에 대해서 살펴보겠습니다.
* 타입 주석
- 타입스크립트는 자바스크립트 변수 선언문을 확장해 다음과 같은 형태로 타입을 명시할 수 있습니다.
let 변수 이름: 타입 [= 초깃값]
const 변수 이름: 타입 = 초깃값
let n: number = 1;
let b: boolean = true; // 혹은 false
let s: string = 'hello';
let o: object = {};
* 타입 추론
- 타입스크립트는 자바스크립트와 호환성을 위해 타입 주석 부분을 생략할 수 있습니다.
- 타입스크립트 컴파일러는 다음과 같은 코드를 만나면 대입 연산자 = 오른쪽 값에 따라 변수의 타입을 지정합니다.
let n = 1; // n의 타입을 number로 판단
let b = true; // b의 타입을 boolean으로 판단
let s = 'hello'; // s의 타입을 string으로 판단
let o = {}; // o의 타입을 object로 판단
* any 타입
- 값의 타입과 무관하게 어떤 종류의 값도 저장할 수 있습니다.
let a: any = 0;
a = 'hello';
a = true;
a = {};
* undefined 타입
- 자바스크립트에서 undefined는 값입니다.
* 인터페이스 선언문
- 타입스크립트는 객체의 타입을 정의할 수 있게 하는 interface라는 키워드를 제공합니다.
- 인터페이스는 객체의 타입을 정의하는 것이 목적
interface 인터페이스 이름 {
속성 이름: 속성 타입
}
* 선택 속성
- 어떤 속성은 있어도 되고 없어도 되는 형태로 만들고 싶을 때가 있습니다.
- 이러한 속성을 선택 속성이라고 합니다.
interface IPerson {
name: string // 필수 속성
age: number // 필수 속성
etc?: boolean // 선택 속성
}
* 익명 인터페이스
- interface 키워드도 사용하지 않고 인터페이스의 이름도 없는 인터페이스를 만들 수 있습니다. 이를 익명 인터페이스(anonymous interface)라고 합니다.
let ai: {
name: string
age: number
etc?: boolean
} = {name: 'Jack', age: 32}
* 클래스 선언문
class Person1 {
name: string
age?: number
}
- 접근 제한자 : 클래스의 속성은 public, private, protect와 같은 접근 제한자(access modifier)를 이름 앞에 붙일 수 있습니다. (만약 생략하면 모두 public으로 간주합니다)
* 인터페이스 구현
interface IPerson4 {
name: string
age?: number
}
class Person4 implements IPerson4 {
name: string
age: number
}
* 타입 단언
- 타입이 있는 언어들은 특정 타입의 변숫값을 다른 타입의 값으로 변환할 수 있는 기능을 제공합니다.
- 두 가지 형태가 존재합니다.
(<타입>객체)
(객체 as 타입)
export default interface INameable {
name: string
}
import INameable from './INameable';
let obj: object = {name: 'Jack'};
let name1 = (<INameable>obj).name;
let name2 = (obj as INameable).name;
반응형
'typescript' 카테고리의 다른 글
프론트엔드 webpack + typescript 설정 (0) | 2021.09.17 |
---|---|
타입스크립트 프로젝트 만들기 (0) | 2021.08.15 |