TypeScript (3) 썸네일형 리스트형 TypeScript with React 1. setState가 props로 전달될 때import React, { Dispatch, SetStateAction } from 'react';type ChildProps = { setCount: Dispatch>;};function Child({ setCount }: ChildProps) { return setCount(prev => prev + 1)}>증가;} 2. useRef 타입 지정import React, { useRef } from 'react';function MyComponent() { const inputRef = useRef(null); return ;} 두 가지 방법이 있습니다 첫 번째, forwardRef를 사용하여 ref 전달하기 import React, { forwa.. 고급 TypeScript 문법 1. 제네릭 (Generics)제네릭은 함수, 클래스, 인터페이스 등을 정의할 때 구체적인 타입을 미리 정의하지 않고 나중에 실제 사용될 때 그 타입을 지정할 수 있게 해줍니다. 즉, 여러 타입에 대해 유연하게 대응할 수 있는 기능 function wrap(value: T): T[] { return [value];}const num = wrap(10); // [10] - T가 number로 추론const str = wrap("hi"); // ["hi"] - T가 string으로 추론 는 임의의 타입을 의미하며, 함수나 클래스, 인터페이스에 다양하게 사용할 수 있습니다. 2. 유틸리티 타입TypeScript는 이미 자주 쓰이는 패턴을 위한 유틸리티 타입을 기본으로 제공합니다.1) Partial객체의 .. type 과 interface의 차이 차이점 1: 확장 방식// interface는 extends로 확장 가능interface Person { name: string;}interface Developer extends Person { skill: string;}// type은 &로 확장 (intersection)type PersonType = { name: string;};type DeveloperType = PersonType & { skill: string;}; 차이점 2: 선언 병합// interface는 중복 선언 가능 (자동 병합)interface Animal { name: string;}interface Animal { age: number;}// 결과: { name: string; age: number }// type.. 이전 1 다음
