[TypeScript] 타입

jr_necki·2022년 8월 22일
0

TypeScript

목록 보기
2/7
post-thumbnail
post-custom-banner

✔ Object 타입

playerHong 객체에 이름과 나이 변수를 넣어보자. type을 지정해주어야하므로 name,age 각각 타입을 써주어야 한다.

const playerHong:{
    name:string,
    age:number
}={
    name:"hong",
    age:12
}

여기서 optional 이라는 특징을 설정할 수 있는데, 만약 age를 optional로 설정하면 playerHong 객체는 age가 없을 수도 있다는 것을 뜻한다.

const playerHong:{
    name:string,
    age?:number
}={
    name:"hong"
}

optional을 하고 싶은 변수에 ?만 붙여주면 된다!

✔ alias

그런데 player마다 저렇게 타입을 지정한다면 매우 번거로울것이다.

Player 타입을 지정해주고, 원하는 객체를 만들때 player타입을 넣어주면 훨씬 간편하다. 이렇게 별칭해주는 것을 alias라고 한다.

type Player = {
    name:string,
    age?:number
}

const hong:Player = {
    name:"hong"
}
const kim:Player = {
    name:"kim"
}

재사용성이 증가한것을 볼 수 있다.

✔ 함수

함수에 필요한 인자가 있으면, 타입을 지정해주고, 리턴 타입 또한 지정해주면 된다.

function playerMaker(name:string) : Player{
    return {
        name
    }
}
const necki = playerMaker("necki");
necki.age = 10;

playerMaker함수의 리턴 타입이 Player이므로 necki는 age도 설정할 수 있게 되는것이다.

화살표 함수일 땐??

const playerMaker=(name:string) : Player =>({name})

같은 맥락 ㅎㅎ

✔ 튜플

배열안에 특정 위치에 특정 타입을 지정하고 싶을경우!

const player:[string,number,boolean]=["nico",12,true]

✔ 기타

let a : unknown; // 변수 타입을 미리 얻지 못할 때 사용.

if(typeof a === 'string'){
    let b = a.toUpperCase();
}

// 아무것도 리턴하지 않는 함수 :void
function hello(){
    console.log('x');
}

// 절대 리턴하지 않는 경우,또는 리턴타입이 2개일때 :never
function hello2(name:string | number){
   if(typeof name === 'string'){
       name // string
   }else if(typeof name === 'number'){
       name // number
   }else{
       name // never
   }
}
profile
슉슉슉
post-custom-banner

0개의 댓글