Typescript ②

TYPE SCRIPT

불변성 (immutability)

readonly 속성

요소에 '읽기 전용' 속성 지정 가능

(1)

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

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

const nico = playerMaker('nico');
nico.age = 12
nico.name = 'hello'   //(X)

(2)

const numbers : readonly number[] = [1, 2, 3]
numbers.push(4)    // (X)

: push와 같이 array에 영향을 끼치는 메소드 사용 불가

✔ 데이터 타입

Tuple

array 생성 시, 최소한의 길이를 가져야하고 특정 위치에 특정 타입이 존재해야한다.
: 항상 정해진 갯수의 요소를 가져야하는 array를 지정할 수 있다~!
: 원하는 순서에 맞는 타입을 가져야한다.

const player : [string, number, boolean] = ['nico', 1, true]
player[0] = 2	// (X)
player[0] = 'jay'	// (O)

ㄴ 이따금씩 API가 object 대신 array를 주는 경우가 있는데 tupple로 타입을 지정해줄 것.

Tuple과 readonly 결합

const player = readonly [string, number, boolean] = ['nico', 1, true]
player[0] = 'hi'	// (X)

JS에도 존재하는 타입

- undefined

let a : undefined = undefined

- null

let b : null = null

- optional type + undefined

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

- any

let a = []

비어있는 값의 기본값 : any ---> 아무 타입이나 될 수 있다
타입스크립트의 보호장치로부터 벗어날 수 있다

: 자바스크립트처럼 사용 ( 타입스크립트 비활성화 )

const a : any[] = [1,2,3]
const b : any = true
a + b	// 아주 좋지 못한 코드도 허용

✔ JS에서 존재하지않는 타입

- unknown

어떤 타입인지 모르는 변수는 Typescript에서 어떻게 표현해야할까?

ex) API로부터 응답을 받는데, 그 응답의 타입을 모르는 경우

let a : unknown;

작업 이전에 변수의 타입을 먼저 확인해야하는 방식으로 일종의 보호를 받을 수 있다.

• 1

( X )

let a : unknown;
let b = a + 1;   // (X)  ---> 확인작업 강제


( O )
let a : unknown;
if(typeof a === 'number') {		// 조건문을 통하여 a의 타입이 number인지 확인
    let b = a + 1;  // (O)
}

---

• 2

( X )
let a : unknown;
a.toUpperCase();     // (X)	  ---> 확인작업 강제


( O )
let a : unknown;
if(typeof a === 'string') {
    let b = a.toUpperCase();    // (O)
}

: 변수의 타입을 미리 알지 못 할 때, unknown 사용
: typescript가 타입 확인작업을 강제

- void

어떠한 것도 return하지 않는 함수

function test () {		// type : void
	console.log('x');
}

function test () : void  {		// type : void
	console.log('x');
}

따로 지정하지 않아도 괜찮음
-> typescript는 함수가 아무것도 return하지 않는다는 것을 자동으로 인식

const a = test();
a.toUpperCase();	//(X)

void는 아무것도 return하지 않기에 toUpperCase()사용 X

- never

함수가 절대 return하지 않을 때 발생

( 1 ) 함수에서 exception(예외)발생할 경우

function test () :never {
    throw new Error('xxx')
}

: 오류를 발생시키는 함수

( 2 ) 타입이 두가지 일 수도 있는 경우

function test (name : string | number) {
    if(typeof name === 'string') {
        name  // 여기서 name은 string
    } else if (typeof name === 'number') {
        name  // 여기서 name은 number
    } else {
        name  //여기서 name은 never -> 실행되지 않는다
    }
}

typescript에게 name은 string이나 number이라고 알려주고 조건문을 통하여 두 타입 모두 확인을 하였기에 이후에 무엇을 쓰던지 그 타입은 never이된다~!

: 타입이 올바르게 들어왔다면 해당되는 조건에 맞게 작동될 것

UNION
or(|) and(&)