본문으로 바로가기

[TypeScript] Basic Overview

category Front-end/Typescript 2022. 7. 21. 15:05

  • Javascript 는 인터프리터 언어. (내부 엔진에서 컴파일을 진행하기도 함)
  • Typescript 는 컴파일 언어. 컴파일 하고나면 보호장치 없는 자바스크립트로 바뀜.

?: → (옵션) type이 있거나 undefined 임.

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

// makePlayer = makePlayer2
function makePlayer (name:string) : Player{
    return {name}
}

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

let player = makePlayer("ning");
player.age = 1 // Player type 명시해줘서 age 라는 parameter 추가가 가능

readonly : 읽기 전용

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

tuple : 한 Array 에 여러 Type을 담을 수 있다.

const player3 : [string, number, boolean] = ['ning', 3, false]

any : Typescript의 보호장치를 비활성화 시킴.

const player4 : any = 'Typescript로 부터 빠져나오고 싶을 때 any'

unknown : type check 보호장치

let a:unknown;

// 허용되지 않음
let b = a+1;

// type check 후 허용
if(typeof a === 'number'){
    let b = a+1;
}
if(typeof a === 'string'){
    let b = a.toUpperCase();
}

void : return 값 없을때. (생략가능)

function hello():void{
    console.log('hello');
}

never : 항상 오류를 출력하거나 리턴 값을 내보내지 않음

function hello2(name:string|number){
    if(typeof name === 'string'){

    }
    else if(typeof name === 'number'){

    }
    else {
        // 이때 name type 은 never
    }
}

// error 발생
function hello3():never{
    throw new Error('dd')
}

'Front-end > Typescript' 카테고리의 다른 글

[TypeScript] Interface  (0) 2022.08.01
[TypeScript] Class  (0) 2022.08.01
[TypeScript] Generics  (0) 2022.07.25