타입스크립트 맵드 타입 정리 ❓상황 타입스크립트 기본 개념 중 하나인 mapped type 정리 📖 맵드 타입이란? 기존에 정의되어 있던 타입을, 새로운 타입으로 변환해주는 문법이다. 아래는 변환 예시이다. // 기존 타입 type userType = { name: string, email: string } // 새로운 타입 type newUserType = { name: number, email: number } 🧮 정리 개요 위의 변환 예시를 보면, 기존 타입의 key는 동일하나, value는 달라진것을 알 수 있다. 이것을 변환하는 방법을 이해하기 위해서는 typeof, keyof, in 키워드를 알고 있어야한다. typeof 자바스크립트에 typeof 키워드가 존재하는데, 자바스크립트의 typeo..

타입스크립트 제네릭 정리 ❓상황 타입스크립트 기본 개념 중 하나인 제네릭 정리 📖 제네릭이란? 재사용성이 높은 컴포넌트를 만들 때, 자주 활용되는 기법이다. 특히, 한가지 타입보다는 여러가지 타입이 동작하는 컴포넌트를 만들 때 주로 활용된다. 🧮 정리 기본 문법 제네릭은 변수명 뒤쪽에 꺽쇠()와 타입을 넣으면 된다. 이때, 타입은 string, number가 아닌 제네릭 타입 변수를 넣어준다. 주로 알파벳 T를 사용한다. 그리고 제네릭 타입변수 T를 일반 타입(number, string )처럼 활용하면 된다. 제네릭 함수 만약 함수의 인자가 어떤 타입이 들어올지 몰라 any 타입으로 지정한다면, 함수의 return 타입도 또한 any 타입이다. function foo(name: any): any { re..

error: failed to push some refs to 'https://github.com/tenenger/-------------' ❓상황 git push -u origin main 명령어 입력시, 발생한 오류 🔎 원인 파악 현재 로컬 branch의 이름이 master인데, git hub에 push할때는 main branch를 push하겠다고 하니 컴퓨터가 오류를 내뱉는 것이었다. 그런데, 내 git hub 계정에는 초기 branch 이름을 main으로 설정했는데, 왜 master branch가 생겼을까 의문이 들었다. 알고보니, 예전 master branch를 clone을 해서 내 컴퓨터에 복사했기때문에, main branch가 아니라 master branch가 생긴것이었다. 참고로 알아두면 ..

타입스크립트 enum 정리 ❓상황 타입스크립트 기본 개념 중 하나인 enum 정리 📖 typescript 란? 자바스크립트에 타입이 추가된 자바스크립트 확장버전이라고 생각하면 쉽다. 기존에 자바스크립트를 사용할때는, 코드 작성시에 타입을 적지 않기때문에 구문에러가 발생해도 코드상에는 문제가 없기때문에 오류를 발견하기 어렵다. 만약, 코드 작성할때 타입을 명시한다면 타입스크립트를 자바스크립트로 컴파일하는 단계에서 구문에러가 catch 되는 연유로인해, typescript가 javascript보다 더 사랑받는 존재이지 않나 싶다. 🧮 정리 기본 문법 자바스크립트의 객체 형태와 유사하게 key는 문자열, value는 숫자나 문자열을 갖는 형태로 나타낼 수 있다. enum Direction { Up = 'Str..

자바스크립트로 HTML 요소 추가시 기존에 등록한 addEventListener 이벤트가 정상적으로 작동하지 않는다. ❓상황 자바스크립트로 HTML 요소를 innerHTML로 추가시 기존에 등록한 addEventListener 이벤트가 정상적으로 작동하지 않는 상황 🔎 원인 파악 오류가 아니라, innerHTML로 HTML 요소를 추가하면, 형제 노드와 하위 노드에 등록된 addEventListener가 없어진다고 한다. [javascript] 자손의 이벤트 리스너를 파괴하지 않고 innerHTML에 추가 할 수 있습니까? - 리뷰나라 다음 예제 코드에서는 onclick“foo”라는 텍스트가 포함 된 범위에 이벤트 핸들러를 연결합니다 . 핸들러는 alert(). 그러나 부모 노드의에 할당하면 innerH..