월드스토리의 코딩 나라

TypeScript의 Generic 타입 위처럼 다양한 타입을 반환하는 함수가 있을 때, 모든 데이터 타입을 쓰거나, any를 사용한다면 TypeScript를 사용하는 목적이 모호해지는 문제가 발생한다.그래서, Generic이라는 타입을 java에서 가져와쓰게 되었는데? Generic이란?함수를 선언할 때가 아니라, 호출할때 데이터 타입을 지정하게 하기 위한 문법으로 정의가 가능하다. 즉, 타입의 변수화라고 보면  된다는 거다. 그래서 어떻게 사용하냐?function arrLength2(arr:T[]):number{ return arr.length } arrLength2(["a"]); arrLength2([1, 2, 3, 4]); • 함수를 호출할 때 매개변수로 들어갈 데이터 타입을 설정• 타입을 함..

typescript의 함수 선언• 선언시에 타입설정, 호출할 땐 기존처럼 매개변수 타입셜정과 함수의 return 타입에 따라 함수 전체 타입을 설정할 수 있다.단, 이미 알고 있는 타입 외에도 never와 void라는 함수 리턴 타입을 설정할 수 있다. typescript 함수 선언 방식 1. 파라미터와 리턴 타입을 선언하는 기본 형식 function sum(a : number, b: number) : number {return a + b;} 2. 화살표 함수를 이용한 타입 선언 const sum = (a: number, b : number) : number => {return a + b;}const sum = (a: number, b: number) : number => a+b;//한줄의 간단한 연산의..

Tuple• Js에서는 배열과 같습니다.• 순서와 개수가 정해져 있는 배열 (요소의 길이와 타입 고정)• 일반 배열과 다른 점은 배열의 각각의 타입에 모두 type을 지정해줘야 합 니다!• 순서와 규칙이 있는 배열이 있다면 Tuple을 이용!• readonly를 설정하면 const를 사용하지 않더라도 읽기만 가능한 data type이 됨  Enum (열거형)• 숫자 열거형과 문자 열거형• 값들에 미리 이름을 정의하고 사용하는 타입• enum의 value 값으로는 문자열 혹은 숫자만 허용되며, 선언 이후로는 내용을 추가, 삭제할 수 없다.• 값을 넣지 않고 선언한다면 숫자형 Enum 가장 위의 요소부터 0으로 할당돼서 1씩 늘어나게 된다. any어떤 타입이든 상관없이 오류가 나지 않으며, Typescrip..

TypeScript 란?• JavaScript 의 기본 문법에 자료형 체크하는 기능을 추가한 것 • 자바스크립트가 자의적으로 type 해석을 하고 코드를 실행시켰을 때, 의도와 다른 방식으로 쓰이지 않도록 방지=> 실행하지 않더라도 코드 상의 에러를 알려줌 TypeScript의 특징 타입의 지정변수나 함수를 만들어 줄 때, 타입까지 명시하여 선언함으로써 프로젝트의 안정성을 높인다.ts파일의 사용웹 브라우저는 ts파일을 읽을 수 없기에 js로의 변환 과정을 반드시 필요로 한다. TypeScript의 사용 방법 1. TypeScript는 별개의 언어이기 보단 라이브러리 모듈에 가깝다.npm install -g typescript2. 파일 설치가 잘되어 있는지 version을 확인한다.tsc -v3. type..

컴포넌트 상태 종류Local 각각의 컴포넌트가 소유하고 있는 상태를 의미. 이 상태는 해당 컴포넌트 내에서만 관리되고 사용됨Cross-Component 두 개 이상의 컴포넌트 간에 공유되는 상태를 의미하며 props를 통해 상태를 전달App-Wide State애플리케이션의 전체 영역에서 사용되는 상태. 여러 컴포넌 트, 혹은 앱의 전체 영역에서 공유되어야 하는 데이터나 상태에 사용됨= > Cross-Component와 App-Wide State 일 때 Context API나 Redux가 요구됨  Context APIReact version 16부터 사용 가능한 리엑트의 내장 API컴포넌트 아래로 props를 사용하지 않고 필요한 데이터 state를 쉽게 공유할 수 있도록 해주는 것React 앱의 모든 컴..