유형 | JS타입 | TS타입 |
---|---|---|
수 타입 | Number | number |
불리언 타입 | Boolean | boolean |
문자열 타입 | String | string |
객체 타입 | Object | object |
JS는 var키워드를 사용해 변수를 선언할 수 있다. 그런데 var는 다른프로그래밍 언어와는 다르게 동작하기에 let,const키워드를 도입해 다른 프로그래밍 언어와 같은 방식으로 동작하도록 했다. 사실사 ESNext는 var키워드를 사용하지 말라고 권고한다.
let으로 선언한 변수는 코드에서 그 값이 수시로 변경될 수 있음을 암시한다.
let 변수이름 [=초기값]
const로 변수를 선언할 때는 반드시 초깃값을 명시해야한다. const 변수는 코드에서 변숫값이 절대 변하지 않는다는 것을 암시한다.
const 변수이름 = 초기값
any는 값의 타입과 무관하게 어떤 종류의 값도 저장할 수 있다.
let a: any = 0
a = 'hello'
a = true
a = {}
JS에서 undefined는 값이다. 변수를 초기화하지 않으면 해당 변수는 undefined값을 가진다
그러나 TS에서 undefined는 타입이기도 하고 값이기도 하다
let u: undefined = undefined
타입 상속 관계를 따지자면 any는 최상위 타입, undefined는 최하위타입이다.
undefined로 타입을 설정하고 값을 number로 준다면 오류가 발생한다.
TS는 JS변수 선언문을 확장해 다음과 같은 형태로 타입을 명시할 수 있다.
let 변수이름: 타입 = [=초기값]
const 변수이름: 타입 = 초기값
let n: number = 1
let b: boolean = true
let s: string = 'hello'
let o: object = {}
TS는 JS와 호환성을 위해 타입 주석 부분을 생략할 수 있다.
let n = 1
let b = true
let s = 'hello'
let o = {}
TS에서는 변수에 담긴 값을 조합해 문자열을 만들 수 있게 하는 템플릿 문자열을 제공한다.
`${변수 이름}`
let count = 10, message = 'Your count'
let result = `${message} is ${count}`
console.log(result) // Your count is 10
위 계층도에서 object타입은 인터페이스와 클래스의 상위 타입이다.
object타입으로 선언된 변수는 number,boolean,string타입의 값을 가질 수는 없지만,
다음처럼 속성 이름이 다른 객체를 모두 자유롭게 담을 수 있다.
let o: object = {name: 'Kang', age: 26}
o = {first: 1, second: 2}
이 코드에서 object타입은 마치 객체를 대상으로 하는 any타입처럼 동작한다. TS의 인터페이스 구문은 이렇게 동작하지 않게 하려는 목적으로 고안되었다.
TS는 객체의 타입을 정의할 수 있게 하는 interface키워드를 제공한다.
다음의 IPerson인터페이스의 목적은 name, age라는 이름의 속성이 둘 다 있는 객체만 유효하도록 객체의 타입범위를 좁히는데 있다.
필수 속성 -> 필수적으로 있어야 유효한 속성
선택 속성 -> 있어도 없어도 되는 속성
interface IPerson {
name: string //필수속성
age: number //필수속성
etc?: boolean // 선택속성 -> 있어도 되고 없어도 되는 속성
}
TS에서는 interface키워드를 사용하지 않고 인터페이스의 이름도 없는 인터페이스를 만들 수 있다.
let ai: {
name: string
age: number
etc?: boolean
} = {name: 'Kang', age: 26}
TS는 객체지향언어에서 흔히 볼 수 있는 class, private, pulic, protected, implements, extend와 같은 키워드를 제공한다.
class Person1{
name: string
age: number
}
다른 객체지향언어와 마찬가지로 TS클래스는 인터페이스를 구현할 수 있다.
클래스가 인터페이스를 구현할 때는 implements 키워드를 사용한다.
주의할 점은 클래스 안에는 반드시 인터페이스가 정의하고 있는 속성을 멤버속성으로 포함해야 한다.
interface IPerson4 {
name: string
age?: number
}
class Person4 implements IPerson4 {
name: string
age: number
}
추상클래스는 자신의 속성이나 메소드 앞에 abstract를 붙여 나를 상속하는 다른 클래스에서 이 속성이나 메소드를 구현하게 한다.
다음 AbstractPerson5는 name속성앞에 abstract가 붙었으므로 new연산자를 적용해 객체를 만들 수 없다.
abstract class AbstractPerson5{
abstract name: string
constructor(public age?: number) {}
}
TS에서는 다음처럼 extends키워드를 통해 상속클래스를 만들 수 있다.
class Person5 extends AbstractPerson5{
constructor(public name: string, age?: number) {
super(age)
}
}
let kang5: Person5 = new Person5('Kang', 26)
console.log(jack5)