타입 스크립트를 배우면서
뭔가 문법은 방대(주관적 기준)한데, 이걸 도대체 어디서 활용하지? 라는 의문점만 강하게 생긴다.
그래서 배우는게 더 어려운것같기도하고..
타입스크립트 문법 정리
1) enum 타입
뭔가를 열거할때 쓰는 타입,
enum Direction {
Up,
Down,
Left,
Right,
}제일 위를 기준으로 0부터 오름차순으로 값이 할당된다. 근데 이걸 도대체 어디서 쓰는건지..
감이 안잡힌다. 내가 아직 실무일을 하지 못해서 그런건가?
2) as const 문법
as const로 상수형으로 취급할수 있다.
const people = {
name: "Tom",
age: 24,
gender: "male",
} as const해당 객체는 상수형으로 취급되어 밸류를 수정할수 없다. + 엄격하게 타입을 추론하게 한다.
3) keyof, typeof
객체에서 key를 리터럴 타입으로 가지고 올때 사용한다.
const people = {
name: "Tom"
age: 24,
}
여기서 객체 key를 타입으로 사용하려면,
type PeopleKeyType = keyof people -> const people을 타입으로 먼저 변환시켜서 그 타입에서 키를 따와야 하기 때문에 그 때 사용하는게 typeof이다. ->
type PeopleKeyType = keyof typeof people
결과 -> name | age
만약에 typeof만 입력한다면 객체의 형태의 타입이 됨.
{
name: string
age: number,
}
이런식으로typeof는 타입을 가져온다고 기억하자.
value를 타입으로 가져오고 싶다면?
const obj = {a: "a", b: "b", c: "c"}
type ValueType = keyof typeof obj 로 key타입을 추출하고 -> typeof obj[keyof typeof obj]
객체에서 일반 밸류값 가져올때 하는 방식으로 하면 된다. 다만 타입추론을 느슨하게 하기 떄문에
as const로 엄격하게 타입을 추론하게 한뒤 사용한다.
const obj = {a: "a", b: "b", c: "c"} as const
type ValueType = typeof obj[keyof typeof obj]
이렇게하면 밸류타입이 유니온으로 추출됨.
4) &(intersection)과 |(union)
&과 |이 있는데 의미가 다르다.
1) type Test01 = {a: "a"} | {b: "b"}
2) type Test02 = {a: "a"} & {b: "b"}두개의 차이점은 뭘까?
1번의 경우에는 아래처럼
const obj:Test01 = {a: "a"} or {b: "b"}둘중 한개만 있어도 되지만
2번의 &(intersection)의 경우에는 아래처럼
const obj:Test02 = {a: "a", b: "b"}두개의 타입이 다 있어야한다.
5) type ailas와 interface의 차이점?
1) type ailas
먼저 type은 &을 이용해 확장을 할 수 있다.
type A = {a: "a"}
type B = A & {b: "b"}
type C = B & {c: "c"}
---
const D: C = {a: "a", b:"b", c:"c"}이런식으로 반드시 있어야 된다는 의미의 &를 활용해 확장이 가능하다.
2) interface
interface의 확장방식은 2가지가 있다.
첫번째는 class와 같이 extends를 이용한 방식
interface A {
a: "a",
}
interface B extends A {
b: "b",
}두번째는 같은 인터페이스를 재 선언 하는것이다.
interface A {
a: "a"
}
interface A {
b: "b"
}
interface A {
c: "c"
}간단하게 표현하고 싶을때는 type, 대체로 자주쓰는 방식은 interface방식이라고 한다.
타입 확장의 자유도가 더 높기 때문인것 같다. type같은경우 같은 이름으로 재 선언 하지 못하니,
실무 이름 표기법
타입스크립트에서 최근에는 안쓰는 추세라고는 하지만 타입 네이밍 기법이 있다고 한다.
interface면 I를 붙이고
type이면 T를 붙이고
enum이면 E를 붙이는 기법이라고 한다.
안쓰인다고는 하나, 해당 기법을 이용해 네이밍을 한 경우도 있을테니 숙지해두자~
