단언

@2023/09/17

안녕하세요 lika-7입니다

이번 시간은 TypeScript의 단언에 대한 내용을 정리하겠습니다

단언이란

단언이란 변수나 값의 타입을 개발자가 컴파일러에 명시적으로 알려주는 것을 말합니다.

개발자가 해당 타입에 대해 확신이 있을 때 사용하는 타입 지정 방식입니다.

단언 방법

as 키워드 사용 단언

//TypeScript

const el = document.querySelector('body')
el.textContent = 'Hello world!'

위의 코드를 이용해 el.textContent에 문자열을 할당하려면 에러가 납니다

에러 내용은 TypeScript가 보기엔 el은 HTMLBodyElement 일수도 있지만 null일수도 있다고 합니다.

//TypeScript

const el = document.querySelector('body') as HTMLBodyElement
el.textContent = 'Hello world!'

우리는 null 타입을 사용하려는게 아니라 HTMLBodyElement 타입을 사용할것을 확실하게 알고 있습니다.

이에 as 키워드를 이용하여 단언 합니다.

위의 코드에서는 el의 타입은 HTMLBodyElement라고 타입을 단언하였습니다.

타입을 단언하여 코드상 에러가 생기지 않게 됩니다.

//TypeScript

function getNumber(x: number | null | undefined){
	return Number((x as number).toFixed(2))
}
getNumber(3.1415926535)
getNumber(null)

위의 코드는 타입 단언을 통해 코드상에서는 문법적으로 문제가 없다고 나오지만

getNumber( )는 3.1415926535와 null 타입 둘 다 받아야 하기 때문에 실행시 문제가 생깁니다.

//TypeScript

function getNumber(x: number | null, isNumber: boolean){
	if(isNumber){
		return Number((x as number).toFixed(2))
	}
}
getNumber(3.1415926535, true)
getNumber(null, false)

이렇게 두가지의 타입을 받기 위해서는 위의 함수처럼 if문을 통해 함수가 실행되게 만들면 됩니다.

이를 타입 가드라고 부릅니다

타입 가드에 대한 자세한 내용은 아래 링크를 참조해주세요

https://lika7.tistory.com/15

https://lika7.tistory.com/15

Non-null 단언 연산자를 이용한 타입 단언

타입이 null이나 undefined가 아니라고 단언 할 때 사용 합니다.

//TypeScript

const el = document.querySelector('body')
el.textContent = 'Hello world!'

위의 코드를 이용해 el.textContent에 문자열을 할당하려면 에러가 납니다.

el의 타입이 null일수도 있다고 하면서 에러가 났습니다

//TypeScript

const el = document.querySelector('body')
el!.textContent = 'Hello world!'

Non-null 단언 연산자를 추가해서 우리가 사용할 타입은 null이 아닙니다를 컴파일러에게 알려주면 에러가 나지 않게 됩니다.

el!.textContent = 'Hello world!'

할당 단언

할당 단언은 타입을 미리 지정해두고 나중에 초기화 하겠다는 의미입니다.

//TypeScript

let num: number
console.log(num)
num=123

위와 같이 num 변수를 미리 지정하고 나중에 값을 할당하겠다고 하면 타입 지정하라고 에러가 납니다.

//TypeScript

let num!: number
console.log(num)
num=123

이럴 때 변수명 뒤에 !를 붙여주어

컴퓨터에게 나중에 변수 초기화를 하겠다고 하면 문제가 없어 집니다.

⚠️

할당 단언은 TypeScript의 강력한 기능 중 하나이지만 남용하면 타입 안정성을 해칠 수 있으므로 주의해서 사용해야 합니다.