connecting dots

함수 오버로딩두 함수를 하나로 만들어주려면 ? --> 기본적인 구조는 같지만 매개변수가 다를 때 오버로딩을 이용해서 두 함수를 하나로 만들어줄 수 있음 'hello world' 출력하는 방법1. 매개변수에 직접적으로 type을 union으로 주는 방법 2. 함수 오버로딩을 이용한 방법 접근 제어자오류 발생--> 타입스크립트에서는 this로 접근하는 속성들을 위한 type을 class body에 넣어줘야 함↓ 1. public어디서나 접근 가능id, title 앞에 아무것도 안 써있으면 기본적으로 public 적용되어 있는 것 2. protected클래스 내, 상속 받은 자식 클래스에서 접근 가능 3. private클래스 내에서만 접근 가능 복잡한 코드 정리하기원래 코드 수정 코드여기서 public은 생략..

Redux 알아보기- state: 데이터- action: 함수함수도 하나의 데이터이긴 함. 데이터 중 함수는 호출 가능호출을 해서 추가적인 명령을 실행하는 개념 동기 처리는1) 액션을 만들어서 데이터를 어떻게 변경할지 type(액션의 이름)과 payload(매개변수)로 설정한다.2) 필요한 곳에서 디스패치 액션을 호출한다.3) 액션(내부 로직으로)에서 상태를 업데이트할 수 있다.비동기 처리는1) 액션을 만들어서 데이터를 어떻게 변경할지 type(액션의 이름)과 payload(매개변수)로 설정한다.2) 필요한 곳에서 디스패치 액션을 호출한다.3) 액션(내부 로직으로)에서 상태를 업데이트할 수 있다.- fulfilled/rejected (무엇을 의미하는 것인지 등은 파악해야 함)만일 사용자가 버튼을 클릭하는..

타입스크립트 개발환경 구성npm install -g typescript = global로 typescript 설치하겠다 main.ts--> index.html에 연결 --> main.ts를 컴파일해서 main.js 만들어야 함 !주의) 컴파일할 때는 기본적으로 ES3 문법을 사용해서 컴파일하게 설정이 되어있음tsc main.ts  --> watch모드로 main.ts 파일에서 변경된 사항을 자동으로 main.js에 반영tsc main.ts -w  타입 단언(Type assertion)프로그래머가 컴파일러에게 내가 너보다 타입에 대해 더 잘 알고 있고, 나의 주장에 대해 의심하지 말라고 하는 것interface Foo { bar: number; bas: string;}var foo = {} as Foo..

타입스크립트란 ?자바스크립트에 타입을 부여한 언어자바스크립트의 확장된 언어(super set) = 자바스크립트의 기능을 가지고 있고 + 그 외의 기능도 가짐자바스크립트와는 달리 브라우저에서 실행하려면 파일을 한번 변환해주어야 함 --> 이 변환 과정을 컴파일(compile)이라고 함 Typescript: 정적타임(static) 또는 컴파일 타임. 코드 작성 단계에서 오류 확인↓Typescript Compiler↓Javascript: 동적타임(dynamic). 런타임에서 동작할 때 타입 오류 확인 (비교적 안정성이 높음) Type System개발 환경에서 에러를 잡는 걸 도와줌type annotations를 사용해서 코드를 분석할 수 있음오직 개발환경에서만 활성화됨타입 스크립트와 성능 향상과는 관계가 없음..

type FooterProps = { message: string color?: 'blue' | 'red' | 'green' | 'yellow" // 또는}type HeaderProps = { title: string size?: 'small' | 'medium' | 'large' color?:'blue' | 'red' | 'green' | 'yellow"}function Header(props: HeaderProps) { return ( {props.title} )}function App() { return ( // 오류 발생, color에는 black이 들어갈 수 없음 ! )}vite: 간단해서 많이 사용↓webp..