타입 단언은 타입에 확신이 있을 때 사용하는 타입 지정 방식이다. 나 같은 경우에는 `Unsafe member access ~~` 에러가 발생했을 때 주로 타입 단언을 통해 해결했었다. 타입 단언 사용방법 타입 단언은 기본적으로 as 키워드를 사용하여 정의한다. const name = '김씨' as string 타입 단언은 타입 에러를 해결하기 위한 좋은 수단이지만 다음 몇가지 사항을 고려해서 사용해야 한다. 타입 단언 사용 시 고려해야할 것들 1. 타입 안정성 : Type Assertion, 즉 타입 단언을 사용하게 되면 Typescript 유형 검사를 우회하게 된다. 따라서 잘못된 타입으로 단언이 되어 있는 경우 런타임 오류가 발생하거나 실제 값과 일치하지 않는 타입 단언으로 인해 사이드 이펙트가 발..
예전에 인스타그램 클론을 하면서 댓글을 입력하면 document.createElement 를 사용하여 댓글 element를 추가하여 업데이트 하는 기능을 구현했었다. 타입스크립트를 사용하여 이처럼 부모요소에 element를 생성하는 방법에 대해서 알아보고자 한다. 타입스크립트로 이 기능을 구현하기 위해서는 우선 inserAdjacentElement 메서드에 대해 공부해야한다. Element.insertAdjacentElement() Element 인터페이스의 메서드 중 하나인 insertAdjacentElement 는 주어진 노드요소를 주어진 위치에 넣어주는 역할을 한다. insertAdjacentElement(position, element); position 에는 targetElement와 연관된 4..
오늘도 어김없이 에러를 마주했다. 에러 발생 상황 사용 기술 스택 : Nextjs, Typescript, airbnb style guid 부모 컴포넌트인 Footer 내부에 Map 컴포넌트가 존재한다. (단, Map 컴포넌트는 display: none) Footer 에서 클릭 이벤트가 발생하면 푸터 컴포넌트 내부의 state 값이 변하면서 (false -> true) Map 컴포넌트가 나타난다. 그리고, Map 컴포넌트 내부에서 클릭 이벤트와 키보드 이벤트가 발생하면 Footer 컴포넌트의 state 값이 변화 (true -> false)하고 Map 컴포넌트가 다시 사라지도록 로직이 구현되어 있다. 위 로직은 푸터 컴포넌트에서 mapViewState 가 true 이면 Map 컴포넌트가 나타나고, fals..
