NOW OR NEVER

Class와 Callback 함수 class : 다양한 object를 만들기 위한 청사진 class에서 함수 선언시 function 키워드 사용하지 않아도 됨 class에 원하는 기능을 다 정의하게 되면 사용하는 사람이 자세하게 control할 수 없고 재사용률이 떨어진다. callback 함수 class를 하나의 완전히 다 만들어진 완전체로 만들기 보다는 레고로 조립을 해서 원하는 것을 만들 수 있는 것처럼 원하는 기능을 끼워 맞춰서 재조립이 가능한 것으로 만드는 것이 좋다. 그래서 callback 함수를 이용하는 것이다. class 내에서 callback 함수 활용 시 장점 callback 함수를 전달함으로써 원하는 기능을 수행할 수 있다. 사용하는 사람이 원할 때 원하는 기능을 수행할 수 있다. c..

Typescript 복습 고급 타입 Intersection Types 여러 타입을 하나의 타입으로 합쳐진 타입 &로 표현 가능 특정한 타입들을 합쳐줘야 하는 타입이 필요할 때 사용 새로 만들지 않고 기존 타입들을 활용해서 사용하고 싶을 때 사용 Union Types | 로 표현 이타입일 수도 있고 저 타입일 수도 있을 때 사용 단 타입별로 묶어주고 싶을 땐 타입 가드(typeof 활용한 조건문으로)로 반환 값을 달리 해줘야 함 Primitive type이 아닌 인터페이스 타입 등을 가지고도 활용 가능 타입 가드를 member로 확인(변수.do) 사용자 정의 타입가드 만들고(함수로) 조건문의 조건으로 넣고 반환 값으로 (변수).do function 타입가드함수(파라미터 : 인터페이스타입 | 인터페이스타입)..

Typescript 복습 class 클래스 ES6 부터 생겨남 클래스를 통해서 특정 타입의 객체 생성 가능 const 변수이름 = new 클래스이름({parameter}); 클래스로 정의한 인스턴스들을 new 키워드를 통해 변수에 할당할 수 있다 타입스크립트의 경우 안에서 타입을 정의해줘야 한다. 상속하는 클래스 extends 상속받는 클래스 : 상속하는 클래스의 속성을 상속받는 클래스에서도 사용할 수 있게 됨 타입스크립트의 접근 제한자 es6 안엔 없음, private : 선언된 블록 안에서만 접근 가능 기본 값은 public protected : 다른 곳에 상속이 안됨 생성자의 매개변수에 접근제한자 같이 작성시 속성 정의와 동시에 전달받은 인자를 해당 속성에 할당하는 작업을 한번에 할 수 있다. 인터..

Typescript 복습 자바스크립트의 super set(상위집합 : 이전의 자바스크립트, 최신의 자바스크립트 다 해당) 오픈소스 정적인 언어로 자바스크립트와 반대되는 개념 컴파일 시간(작성한 코드가 컴퓨터에서 타입을 검사하는 시간) 가짐 장점 여러 명의 개발자와 협업해서 할 때 실수 방지(강력한 타입이여서) 다양하고 유명한 자바스크립트들은 타입이 다 정의되어 있어 편리하게 사용 가능 프로그래밍 언어로써 모든 자바스크립트 기능을 지원할 뿐만 아니라 최신의 자바스크립트 기능도 지원해서 컴파일을 통해서 자바스크립트를 만들어내는 하나의 언어 컴파일러 설치 : window의 경우 sudo npm install -g typescript 실행 : tsc 타입스크립트 파일 타입스크립트를 컴파일해서 자바스크립트로 만들..

Typescript redux middleware redux-thunk yarn add axios redux-thunk typescript 지원되서 따로 @types로 설치 안해도 됨 quicktype(https://app.quicktype.io/) 받아오는 json 결과물 무슨 타입인지 확인하는 법 json 결과물 복사해서 입력하면 typescript형태로 변환 가능 AxiosError : axios가 에러났을 때 사용하는 에러 객체의 타입 createAsyncAction : 비동기 작업시 사용하기 편한 액션 생성 함수 export const AsyncAction이름= createAsyncAction( 액션이름들 )(); ThunkAction keyof S : 상태가 지니고 있는 key github a..

Typescript React Context API 활용 state context : const context이름 = createContext( null ); dispatch context: const context이름 = createContext( null ); Context 생성 방법 context 안에서 관리할 값을 위한 type alias 선언 const context이름 = createContext(defaultValue값(=보통 null)); Provider 컴포넌트 생성 context 다 작성 provider props를 type alias로 작성 type typeAlias이름 = { children : React.ReactNode;} Provider 컴포넌트 생성, useReducer 선언..

TypeScript 자바스크립트를 알고 있다면 금방 배움 장점 자바스크립트는 weakly type으로 실수를 하게 될 수 있음 코드가 실제로 실행이 되어야만 실수한지 안한지 알 수 있음 타입스크립트 사용시 이런 문제점 보완 가능 VS code 같은 IDE 사용시 많은 도움을 얻을 수 있음 함수 사용시 어떤 파라미터 넣는지 컴포넌트의 props에 어떤 값을 넣는지 실수로 빠뜨린 props 있을 시 에러 감지 사소한 실수 많이 방지 파일 생성 법 디렉토리 생성 : git bash 에서 mkdir 디렉토리명 git bash 에서 cd 디렉토리명 package JSON 생성 : git bash 에서 yarn init -y 해당 디렉토리 에디터로 열기 : git bash 에서 code ./ typescript(t..