typeScript

Typescript

Typescript) React Native에 Typescript 적용하기 - 3

타입스크립트가 적용된 리액트 네이티브 프로젝트 만들기 실습 3번째 useState 사용하기 Generic을 사용하여 상태의 타입을 지정해야 함. 예시) function MessageFrom() { const [text, setText] = useState(''); return ( ); } useRef 사용하기 마찬가지로 Generic을 이용해서 선언하여 사용함 예시) function MessageForm() { const nextId = useRef(1); const onPress = () => { setLastMessage({ id: nextId.curent, message: text, date: new Date(), }); setText(''); nextId.current += 1; }; (...) ..

Typescript

Typescript) React Native에 Typescript 적용하기 - 2

타입스크립트가 적용된 리액트 네이티브 프로젝트 만들기 프로젝트 생성 시, --template react-native-template-typescript 코드를 붙여서 생성함 Type Alias 타입에 별칭 붙임. interface 처럼 객체의 타입 지정 가능 type Person = { name: string; }; const person: Person = { name: 'John'; }; type People = Person[]; const people: People = [{name: 'John'}]; type Color = 'red' | 'orange' | 'yellow'; const color: Color = 'red'; 객체 타입은 interface 나 type 중 취향에 따라 사용하면 됨. 객체..

Typescript

Typescript) React Native에 Typescript 적용하기 - 1

타입스크립트가 적용된 리액트 네이티브 프로젝트 만들기 프로젝트 생성 시, --template react-native-template-typescript 코드를 붙여서 생성함 기본 타입 파일 생성 시, 확장자를 ts 또는 tsx로 설정함. - 리액트 컴포넌트 작성 시 tsx로 설정해야 함. 타입 지정 시 변수 이름 뒤에 : 타입 형태로 지정하여 작성 기본 타입은 자동 추론하여 생성함. let message = 'Hello World'; 위와 같이 변수 선언 가능 함수 타입 함수도 자동 추론 가능 예시) function sum(a: number, b:number) { return a + b; } const result = sum(1, 2); 위와 같이 리턴값 타입 지정 하지 않아도 오류나지 않음. funct..

Kimss민
'typeScript' 태그의 글 목록