타입스크립트에서 기본적으로 제공하는 타입은 자바스크립트와 호완성을 위해 그에 대응하는 타입을 제공해준다.
자바스크립트에서는 첫글자를 대문자로 표시하지만 타입스크립트에서 타입은 소문자로 표시한다.
유형 | 자바스크립트 타입 | 타입스크립트 타입 |
수 타입 | Number | number |
불리언 타입 | Boolean | boolean |
문자열 타입 | String | string |
객체 타입 | Object | object |
타입 주석
타입스크립트는 자바스크립트 변수 선언문을 확장해 다음과 같은 형태로 타입을 명시하는데, 이는 타입 주석이라고 한다.
let 변수이름: 타입 [= 초깃값]
let n: number = 1
let b: boolean = true
let s: string = 'hello'
let o: object = {}
이렇게 선언된 변수값은 타입 주석으로 명시한 타입에 해당하는 값으로만 바꿀 수 있다.
선언된 타입과 다른 타입의 값으로 변숫값을 바꾸려고 시도하면 오류가 발생한다.
let n: number = 1
n = 'a'
위의 예시를 보자면 변수 n 을 number타입으로 정하고 n의 변숫값을 문자열 'a' 로 바꾸게 되면 다음과 같은 오류가 발생한다.
타입 추론
타입스크립트와 자바스크립트와 호환성을 위해 타입 주석을 생략할 수 있는데, 이를 타입 추론이라고 한다.
let n = 1 //n 타입을 number로 판단
let b = true //n 타입을 booleas로 판단
let s = 'hello' //n 타입을 string로 판단
let o = {} //n 타입을 object로 판단
초깃값에 따라 타입을 추론하기 때문에 초깃값에 해당하는 타입으로 지정되며, 그 이후 해당 타입의 값만 저장가능 하다.
any 타입
타입스크립트와 자바스크립트의 호환을 위해 any라는 타입을 제공하며, 어떤 종류의 값도 저장할 수 있다.
let a : any = 0
a = 'a'
a = true
a = {}
undefined 타입
타입스크립트에서 undefined는 타입이면서 값이기도 하다.
undefined는 모든 타입의 최하위 타입으로 상위 타입의 값들을 저장하려고 한다면 오류가 발생한다.
반대로 any타입은 모든 타입의 루트타입, 즉 최상위 타입이다.
객체와 인터페이스
object타입은 인터페이스와 클래스의 상위 타입이다.
object타입으로 선언된 변수는 number/boolean/string 타입의 값은 가질 수 없지만, 속성 이름이 다른 객체를 담을 수 있다.
let o: object = {name:'jack', age: 12}
o = {first: 1, second: 2}
인터페이스(interface)는 객체의 타입을 정의할 수 있게 하는 키워드이다. 객체의 타입을 정의하는 것이 목적이다.
interface 인터페이스 이름 {
속성 이름[?]: 속성 타입[,...]
}
interface Iperson{
name: string
age: number
}
let good: Iperson = {name:'Jack', age:12}
let bad: Iperson = {age: 12} // name속성이 없어서 오류
해당 인터페이스의 name과 age의 속성이 있는 객체만 유효하기 때문에 조건을 벗어나면 모두 오류가 발생한다.
인터페이스에서는 어떤 속성이 반드시 있어야 하지만, 있어도 되고 없어도 되는 형태를 만들기 위해 선택 속성 구문을 사용한다.
interface Iperson{
name: string // 필수 속성
age: number // 필수 속성
etc?: boolean // 선택 속성
}
let good: Iperson = {name:'Jack', age:12}
let good2: Iperson = {name:'Jack', age:12, etc: true}
클래스 선언문
객체지향 언어에서 사용 하는 class, private, public, protected, implements, extend와 같은 키워드를 제공한다.
class 클래스 이름 {
[private || protected || public] 속성 이름[?]: 속성타입[...]
}
class Person{
name: string
age?: number
}
let Jack : Person = new Person()
Jack.name = 'Jack'
Jack.age = 12
console.log(Jack) // Person { name: 'Jack', age: 12 }
constructor(생성자)를 이용하여 클래스의 속성을 선언할 수 있다.
class Person{
constructor(public name: string, public age?: number) {}
}
let Jack : Person = new Person('Jack', 12)
console.log(Jack) // Person { name: 'Jack', age: 12 }
class Person{
name: string
age?: number
constructor(name: string, age?: number) {
this.name = name
this.age = age}
}
let Jack : Person = new Person('Jack', 12)
console.log(Jack) // Person { name: 'Jack', age: 12 }
객체지행 언어와 마찬가지로 클래스로 인터페이스를 구현할 수 있으며, 클래스의 상속도 가능하다.
interface IPerson{
name: string
age?: number
}
class Person implements IPerson{
constructor(public name: string, public age?: number) {}
}
let Jack : Person = new Person('Jack', 12)
console.log(Jack) // Person { name: 'Jack', age: 12 }
class Person extends IPerson{
constructor(public name: string, age?: number) {
super(age)
}
}
let Jack : Person = new Person('Jack', 12)
console.log(Jack) // Person { name: 'Jack', age: 12 }
'언어의 기초 > 타입스크립트(Typescript)' 카테고리의 다른 글
[Typescript] 함수와 선언문 (0) | 2021.02.01 |
---|---|
[Typescript] 타입스크립트 시작하기 (0) | 2020.12.23 |