[TypeScript] ! 연산자(Non-null Assertion Operator)

! 연산자(Non-null Assertion Operator)

들어가며

• 타입스크립트(TypeScript)에서 사용되는 @!@ 연산자(Non-null Assertion Operator)에 대해 정리해본다.
• 이 연산자는 타입스크립트에서만 사용할 수 있다.

 

! 연산자(Non-null Assertion Operator)

개념

• 컴파일러에게 해당 표현식이 @null@ 또는 @undefined@가 아님을 보장한다고 알리는 역할을 하는 연산자

 

사용 예

let value: string | null | undefined = "Hello";

// 여기서 타입스크립트는 value가 null 또는 undefined일 수 있다고 경고할 수 있다.
let length = value!.length;    // ! 연산자를 사용하여 컴파일러 경고를 무시한다.

 

자바스크립트에서의 대체

• @!@ 연산자는 자바스크립트에서는 사용할 수 없고, 타입스크립트에서만 사용할 수 있는 연산자이다.
• 자바스크립트에서는 변수가 @null@ 또는 @undefined@인지 확인하기 위해 보통 조건문을 사용한다.

let value = "Hello";

if (value !== null && value !== undefined) {
    let length = value.length;
}

 

• 또는 간단하게 옵셔널 체이닝 연산자(Optional Chaining Operator, @?.@)와 함께 기본값을 설정할 수도 있다.

let value = null;
let length = value?.length ?? 0;    // length가 null 또는 undefined일 경우 0이 된다.

 

@?.@ 연산자를 사용할 경우 변수의 형식	@!.@ 연산자를 사용할 경우 변수의 형식

 

 

! 연산자(Non-null Assertion Operator)는 자바스크립트에서는 사용할 수 없다. 오직 타입스크립트에서만 사용할 수 있다.

 

참고 사이트

Documentation - TypeScript 2.0

Optional chaining (?.) - JavaScript | MDN