본문 바로가기

분류 전체보기339

event Type const handleButton = (e:React.MouseEvent) => { // e.currentTarget.value } const handleInput = (e: React.ChangeEvent) => { // e.currentTarget.value }; const handleSelectOption = (e: React.ChangeEvent) => { // e.currentTarget.value }; 2023. 3. 15.
제네릭<T> 와 제네릭 설명 듣고 정말 대박이다를 외쳤음 책으로 읽을때 제네릭 부분을 제대로 이해하질 못했다. (졸려서? ㅎㅎ) '도대체 왜 쓰는거지? 인자에 타입을 지정해주는건 알겠고, 반환값에도 타입을 지정해주는 자리가 어디인진 알겠는데, 도대체 제네릭은 뭐지? 기호도 처음보고, 위치도.. 왜 ..' 납득이 잘 안갔다.. 다른분들 코드를 볼때도 가 있으면 너무 헷갈렸는데 function hello(name: T): T { return name } function helloV2(name: Type): Type { return name } 도대체 T 는 뭘까 왜 저 위치에 있는거지? (위의 예시에서 T와 Type는 하는 역할이 완전히 동일하다.) 너무 헷갈렸다. (이해하고 나니까, 저 예제는 인자와 반환 타입에서 사.. 2023. 3. 15.
Cannot find module '모듈명' or its corresponding type declarations. ts git 에서 clone 했을 때 처음 볼 수 있는 빨간줄들 npm install로 패키지를 설치한다~! npm install 2023. 3. 14.
if문과 삼항 연산자 구분해서 사용하기 if문의 경우 조건을 분기할 때, 각기 다르게 동작하는 코드들을 분기할 때 사용하고 삼항 연산자의 경우 값을 대입할 때 주로 사용해보기 2023. 3. 14.
선언적 코드와 절차적 코드, 추상화와 구체 "선언적 코드"를 활용할 것 그렇다면 구체와 추상화는 또 비슷한 개념이 아닐까? 라고 생각되어서 정리해보려고 한다. 늘 함수를 만들면, 코드를 작성하면 '유지보수'하기 쉬운 코드를 위해 고민해야 하는데, 내 코드는 늘 어쩐지 복잡하고 기본적이어서 무언가를 수정하려면 어려운 걸까 혹은 이렇게 결과를 똑같이 내더라도 과연 이렇게 작성하는게 맞는건가? 혹은 다른 분의 코드를 읽었을 때는 가독성이 좋아서 코드를 수정하기도 훨씬 쉬웠다. 그렇다면 내 코드와 차이점은 뭘까? 하는 고민을 하다가 강의를 통해 추상과 구체, 선언적 코드와 절차적 코드를 듣고 내 코드의 문제점을 다시 생각해보게 됐다. 일단 4개의 의미를 각각 분리해서 생각해보기로 했다. 어떻게(HOW)에 관한건 구체 무엇을(WHAT)에 관한건 추상 1을.. 2023. 3. 14.
명시적 표현, 암묵적 표현 코드 가독성 측면에서, 한번 더 생각하게 되는 not 연산자 사용을 지양할 것. 직관적으로 표현할 수 있다면 좋다. 2023. 3. 14.
타입스크립트 [원티드 프리온보딩 교육과정] 사용 이유: 안정성, 표현력 런타임에서 계속 타입을 바꿀 수 있는 언어: 약타입 언어 JavaScript, 다이나믹 타입 언어 강타입 언어: 변수를 선언한 시점부터 지정해야 함. 지정한 타입을 벗어난 값은 해당 값을 할당할 수 없다: 정적타입 컴파일 언어: 통째로 번역함. 책 한권을 다 번역한 뒤 완성본을 내가 받아봄. 최초 실행 시간이 길다(컴파일 하는데 시간이 필요) 인터프리터 언어: 실시간 번역. 책 한문장 한 문장을 바로바로. 앞에서 한걸 또 하면 반복해서 해야하고, 시간이 조금 필요함. 최초 실행 시간이 짧다(바로 하니까) 추상: 나 이거(매개변수) 하면 이거 줄께(리턴). HOW에 관한 부분이 구체, WHAT에 관한 부분이 추상 타입은 추상을 표현한다. 추상 이라.. 2023. 3. 14.
원티드 프리온보딩 프론트엔드 2주차 과제 피드백 [원티드 프리온보딩 교육과정] 변수명 활용 어떤 동작을 의미하는 지 예시는 구조분해 할당. 명시적인 표현 vs 암묵적인 표현 if(!product.length) 암묵적인 표현 => 생각을 많이 해야 해 if(products.length===0) 명시적인 표현=> 암묵적 + not 연산자가 붙는 경우 *not 연산자가 붙으면 조금 헷갈리게 됨. UX 고려 드래그 하다 풀었을 때 적용되면 안됨 드래그할 때 마다 바로 반영되도록 Router Outlet Suspense 불필요한 함수 선언 event 인자를 넣어서 콜백함수를 만들 필요가 없다. 그대로 e 가 들어감 선언적 코드 더 가독성이 좋다. 삼항연산자와 if 문 구분해서 사용하기 statement: 문법적으로 의미있는 코드들의 연속 const, eval .. 2023. 3. 14.
useState의 setState((prev)=> !prev) useState에서 set을 할 때, setState((prev)=> !prev) 2023. 3. 14.