[error] TypeError : Cannot read properties of undefined (reading 'indexOf') 해결

TypeError : Cannot read properties of undefined (reading 'indexOf') 다음과 같은 에러가 발생하였다

 

 

undefined라 뜨길래 indexOf가 typescript나 앵귤러에서 사용하지 못하는 함수인줄 알고 include나 다른 인덱스 함수로 바꾸었지만 똑같이 에러가 떴다.

 

 

문제가 되는 부분은 이 부분 이었다.

...

	[style.backgroundColor] = selectedFont.includes('Bold') ? '#ccc' : 'unset' 
    
...

사용자가 선택한 글자에 'Bold'라는 글자가 포함되어 있으면 true를 리턴하고, 아니면 false를 리턴하여 css를 적용하는 부분이다. 

 

그런데 이때, selectedFont가 지정이 되지 않아 생기는 문제였다. 

위 코드의 경우 처음 폰트를 생성하면, 아무 style도 적용이 되어있지 않으므로 defined되지 않은 값이 넘어오는 것을 확인했다. 

 

 

 

따라서 하단과 같이 코드를 구성하여 font가 defined되었는지 확인하고, 그 이후, 함수를 구성하였다.

...

// font 가 undefined 인지 체크
 if ( typeof (this.selectedFont) === 'string' ) {

	 // 선택한 font가 bold 인지 체크
 	if (this.selectedFont.indexOf('Bold') !== -1) {

...