HTML 조작시 narrowing 하기

html에 있는 엘리먼트를 조작하거나 찾을때 element가 반환될수도 있지만 잘못 이름작성시 null이 반환될 수도 있다. 이러한 이유로 계속해서 개발할 때 브라우저 콘솔에 계속 warning이 찍혔다..

이러한 warning을 해결하기 위해서는 narrowing 작업을 통해 처리해줘야 한다.

 

1. 조건문을 활용한 narrowing작업

let 제목 = document.querySelector('#title');
if(제목!=null){
 	제목.innerHTML = '반가워요'
 }

2. safe operator 연산자를 활용한 narrowing작업

let 제목 = document.querySelector('#title');
if(제목?.innerHTML!=undefined){
 	제목.innerHTML = '반가워요'
 }

이외에도 as 나 instanceof 연산자를 활용하는 방법이 있다고 한다.