Passing Props (Props, setTodos 함수의 타입 명시, setTodos 함수의 콜백함수 1,2 함수를 props로 전달)Children Props (React.FC, PropsWithChildren, Children을 타입으로)Generic, Utility Type 통해서 Props용 Type 만들기 (PropsWithChildren, Omit, Pick)Event Handler 사용하기Passing Props Props부모 컴포넌트에서 자식 컴포넌트에게 Props를 전달할 때 자식 컴포넌트에서 부모에게 받은 Props의 타입을 객체 타입 지정한 것과 동일하게 지정해 주면 된다Props가 많아질 경우, 타입 부분도 길어지므로 간결하게 표시하기 위해 type 또는 interface를 사..
[타입스크립트 Typescript] 강의정리_프로젝트 생성, 함수에서 타입사용하기, 제네릭, 스테이트
React CRA와 TS 한 번에 설치하기Type과 Interface함수에서 TS 사용하기비동기 함수에서 TS 사용하기_1비동기 함수에서 TS 사용하기_2Generic (제네릭)useState에서 사용하기React CRA와 TS 한 번에 설치하기npmyarnnpx create-react-app my-first-ts-app --template typescriptyarn create react-app my-first-ts-app --template typescript pretty type errorTypeScript 오류를 읽기 쉽게 만들어주는 VSCode 플러그인 Type과 Interface Typetype은 새로운 타입을 정의하는 데 사용된다새로운 타입을 만들거나 타입을 결합하거나 변환할 때 사용된다..
boolean number string 배열 tuple enum readonly any unknown union 타입 명시해 주는 방법함수명 = (인자 : 인자 타입) : 리턴값 타입 => 실행 내용함수의 리턴값이 없는 경우 void로 넣어주면 된다const calculateArea = (radius: number): number => Math.PI * radius * radius;const radius = 5;const area = calculateArea(radius);console.log(`반지름이 ${radius}인 원의 넓이: ${area}`);boolean function isValidPassword(password: string): boolean { return password.lengt..
컴파일러(TypeScript Compiler 또는 tsc)프로그래밍 언어로 작성된 소스코드를 다른 프로그래밍 언어로 변환해 주는 도구이다 (TypeScript 코드를 => JavaScript 코드로 변환)컴파일러는 변환 과정에서 소스 코드의 구문과 구조를 검사해 문제가 없는지 확인하며 문제 발견 시 바로 에러 메시지를 출력해 주기 때문에 개발자가 런타임 오류를 방지하고 코드의 안정성을 높일 수 있다타입을 명시적으로 선언하지 않아도 코드를 분석하여 변수 및 함수의 타입을 추론할 수 있으며 코드를 더 간결하게 작성할 수 있도록 돕고, 타입 안정성을 유지할 수 있게 해 준다개발자가 타입을 명시적으로 선언할 수 있도록 타입 어노테이션을 지원한다, 타입을 명시함으로 가독성을 높이고, 코드의 의도를 명확히 전달할 ..
TypescriptJavascript 기반으로 정적 타입 문법을 추가한 프로그래밍 언어Typescript JavaScript 정적 타입의 컴파일 언어동적 타입의 인터프리터 언어변수의 타입을 명시적으로 선언해줘야한다변수의 타입을 실행 시간에 결정하기때문에 별도로 선언해 주지 않아도 된다 타입스크립트 첫날이라 아직 잘 모르겠지만 자바스크립트의 유연함으로 인해 생기는 오류 때문에(타입오류, 등) 동적 타입언어인 자바스크립트를 정적 타입인 자바처럼 사용하기 위해 타입스크립트를 쓰는 건가?라는 생각이 많이 든다 많이 낯설지 않아서 다행이야