Non Null Assertion (Type 'null' is not assignable to type ''.)

김동현·2021년 1월 9일
0

FE- Typescript

목록 보기
2/4
post-custom-banner

문제사항

  • DOM 객체를 받아올때나, 변수를 할당할때 null 값일 가능성이 있다..
// (method) Document.getElementById(elementId: string): HTMLElement | null
const nextElement = currentElement.getAttribute('value');
  • 이때 null 값이 아니라고 분기처리를 하는 것이 가장 기본적인 방법이지만, 더 편리한 방법을 찾고 싶다.
// 아래와 같이 null 값이 아니라고 분기 처리를 해야 한다.
const nextElement = currentElement.getAttribute('value');
if(nextElement !== null) {
 // code...
}
  • type annotation 과 함께 사용한다면, null 값일 경우를 고려하라는 오류를 뱉어낸다.
    이 경우 null 값이 할당될 수 있음을 명시하면 해결 된다. (여전히 null 값이 아닐 때를 분기처리해야한다.)
// Type 'null' is not assignable to type 'HTMLElement'.
const nextElement : HTMLElememt = currentElement.getAttribute('value');
// Okay, 하지만 여전히 null 값이 아닌 경우를 분기 처리 해야함
const nextElement : HTMLEement | null = currentElement.getAttribute('value'); 
  • 하지만 우리는 반드시 null 값이 들어오지 않는다는 보장이 있다고 하자. 어떻게 해야할까?

해결방법

Non-null assertion

  • 해당하는 변수의 마지막에 ! 키워드를 이용하면 (post-fix), 이 변수는 절대로 null 값이 아니라는 걸 알리려고 쓴다.
// 더이상 null 값을 분기처리하지 않아도 되며 type annotation을 같이 사용할 수 있다.
const nextElement : Element = currentElement.getAttribute('value')!;
  • 단, 이 경우 코드상으로 절대로 null 값이 들어오면 안되므로, 확실한 경우에만 사용해야 한다.

참고사이트

profile
Frontend Developer
post-custom-banner

0개의 댓글