전체 글70 typescript에서 객체 사용하는 방 typescript 에서 객체에 타입을 지정해줄 때는 ; 을 사용한다 let stock:{ id:string; name:string; price:number; membersOnly:boolean; sizes:string[]; } let stock:{ id:string; name:string; price:number; membersOnly:boolean; sizes:string[]; } = { id: '1324', name: '귀여운 모자', price: 5000, membersOnly: true, sizes: ['M', 'L', 'XL'], } //값을 입력했을 때 타입오류면 바로 알 수 있다. 프로퍼티 개수를 알 수 없거나 개수를 정해놓고 싶지 않을 경우에 프로퍼티 값에 타입만 지정이 가능 let ob.. 2024. 2. 5. 02.05 typescript에서 배열 사용하기? 문자열 배열을 사용하고 싶을 때 const cart : string[] = [] cart.push('apple') cart.push('banana') /////////// cart.push(123) // -> type 오류가 발생 -> 변수 cart 를 문자열 배열로 지정했으니까 cart.push('apple') 하면 문자열 apple 가 들어가지만 숫자 123을 push 하면 타입 오류가 난다. 배열의 배열 const carts: string[] []= [ ['apple', 'banana'], ['apple'], ['apple'] ] 배열타입에는 크기가 정해져있지 않다. let mySize:number[] = [100, 200]; mySize = [200, 300]; //숫자 3개를 한 배열로 만들기 .. 2024. 2. 5. context Api 공부 자식 컴포넌트에 수많은 props로 내려주면 가독성이 너무 안좋은 propsDrilling이 발생, -> 코드를 읽을 때 해당 prop를 추적하기 힘들어지고 유지보수가 어려워진다 -> react의 상태관리인 context를 사용해보자 현재 App컴포넌트에서 시작해 자식 컴포넌트로 4~5개의 prop을 내려주는 상황 DiaryList를 보면 import React from "react"; import DiaryItem from "./DiaryItem"; const DiaryList = ({ diaryList, onRemove, onModify }) => { return ( {diaryList.length}개의 일기가 있습니다. {diaryList.map((diary) => { return ( ); })} .. 2024. 2. 2. useReducer 다시 찾아볼것 useReducer 상태관리의 크기가 커지고 관리방식이 복잡해 질때 사용 useState의 대체 const [data, dispatch] = useReducer(diaryReducer, []) useReducer 의 배열의 비구조화 할당에 들어오는 첫번째 인자는 state의 값, 두번째 인자로는 무조건 dispatch를 사용해야한다. -> const [data, dispatch] useReducer 의 인자로는 상태변화를 처리하는 함수를 넣고 두번재로는 state의 초기값을 넣는다. -> useReducer(diartReducer, []) const reducer = (state, action) => { switch ( action.type ) { case "INIT": { return action.da.. 2024. 2. 2. 이전 1 ··· 6 7 8 9 10 11 12 ··· 18 다음
