Typescript 느낌표(!) Non-null 단언 연산자 사용법

 

Non-null 단언 연산자(Non-null assertion operator)

자바스크립트는 없고, 타입스크립트에서 사용하는 문법입니다.

null이나 undefined가 아니라고 알려주는 타입스크립트 문법입니다.

 

난 null 이나 undefined가 아니고 반드시 값이 있어!!

Non-null 단언 연산자 사용법

type person = {
    name : string
    age?: number
}

const superman: person = {
    name: 'superman',
}

const num: number  = superman.age // error
const num: number  = superman.age!
console.log(num);

person 타입에서 age 선택적 타입으로 만들었습니다.

 

age 의 경우 있을 수도 있고, 없을 수도 있지만,

num 변수에 할당하려고 하면 타입스크립트에서 오류를 나타냅니다.

 

Non-null 단언 연산자 느낌표(!)를 사용하면

age 값이 정의되지 않고 undefined 또는 null이라면,

기본적으로 age 속성에 타입을 따라가도록 타입스크립트에 지시하게 되는 것입니다.

 

언제 사용하면 좋을까?

Non-null 단언 연산자가 없을 시절에는 

아래와 같이 타입 체크를 해야 하는 방법을 사용하였습니다.

if (typeof superman.age === 'number') {
    const num: number  = superman.age
}

하지만 편리하게 느낌표(!) 하나로 간편하게 처리할 수 있는 장점이 있습니다.

 

하지만

간편하게 오류를 제거할 수 있지만, 주의 깊게 사용하지 않으면 많은 문제를 발생시킬 수 있습니다.

컴파일 과정에서 오류가 발생할 수 있지만, 알 수 있는 방법은 없습니다.

 

모든 변수 뒤에 느낌표(!) 를 붙이는 것은 안됩니다.

왜 오류가 발생하는지 충분히 고민하고 Non-null 단언 연산자를 사용해야 합니다