목록TypeScript (6)
영원히 흘러가는 강
1. 타입스크립트는 자바스크립트의 상위집합. 타입 체커를 통과하면서도 런타임 오류를 발생시키는 코드는 충분히 존재 자바스크립트에서 허용되지만 타입스크립트에서는 문제가 되는 경우도 존재 2. 자바스크립트 프로젝트를 타입스크립트로 전환하는게 아니라면 noImplicitAny 설정하는게 좋음 "undefined는 객체가 아닙니다 "같은 런타임 오류 방지하기 위해 strictNullChecks 설정하는게 좋음 엄격 체크를 하고 싶다면 strict 설정 고려 3. 타입스크립트 타입은 런타임 동작이나 성능에 영향을 주지 않음 타입 오류가 존재하더라도 코드생성 가능 타입과 런타임 동작 무관하여 오버로딩 불가능 4. js 는 덕 타이핑 기반 따라서 타입스크립트 또한 덕 타이핑 기반 덕타이핑은 따로 정리 5. any 타..
정확히 용어는 차차 찾아보는 걸로... 말로 풀어보자면 object name , value 에서 배열 안의 값이 일치한다면 value 뽑아내는 코드에서의 typescript const StatusCategory={ ready:'준비중' start:'진행중' end:'종료' } //category에 ready,start,end 값이 온다고 할때 StatusCategory[category] 로 설정되어있다면 type AllCategory= 'ready'|'start'|'end' 로 설정 가능 후에 StatusCategory[category as AllCategory] 로 설정 StatusCategory에 object로 있는 값을 category의 값으로 출력 AllCategory에는 위의 3가지 값이 다 올..
interface 객체값{ name:string; id:number; } interface Props{ y: 객체값[]; } const XXX=({불러오는값}:Props)=>{ ... } Props 로 전달받는 "불러오는값" 의 내부 객체를 "객체값" 으로 타입스크립트 인터페이스로 정의 배열 안 객체이므로 "객체값"을 배열선언
타입스크립트 + 리액트 공부!! 가장 어렵게 생각되었던 부분은 props 부분이다..! 부모에서 값을 전달시 하위 자식에서 전달 받은 값에 대한 타입을 지정한다 부모 const parents:React.FC=()=>{ retrun ( ) } 자식 interface props{ text:string; } const Child:React.FC=()=>{ retrun ( ) } 혹은 const Child:React.FC=()=>{ retrun ( ) }
TypeScript의 기본 타입에는 크게 12가지가 존재! String let str:string='Hello'; Number let num:number=100; Bolean let isLastName: boolean=true; Object let user: { name: string, age: number } = { name: 'GR', age: 100 }; console.log(user); // {name: "GR", age: 100} Array let arr:number[]=[1,2,3];//배열시에 let arr:Array=[1,2,3]; //제네릭을 사용할 수 있다 Tuple 튜플은 배열의 길이가 고정되고 각 요소의 타입이 지정되어 있는 배열 형식 let arr:[string,number]=['..
TypeScript는 JavaScript에 타입을 부여한 언어이다! JavaScript의 확장된 언어라고 볼 수 있다 TypeScript는 JavaScript와 달리 브라우저에서 실행하려면 파일을 컴파일 해야한다 타입스크립트를 쓰는 이유 에러의 사전 방지 JS 사용시 function sum(a,b) { return a + b; } sum(10,20) //30 sum ('10','20') //1020 우리는 숫자 계산을 위해 sum이라는 함수를 만들었는데 위의 결과는 우리가 예상한 결과지만 아래의 결과는 우리가 생각했던 결과가 아닐것이다! 그리하여! TS 사용시 function sum(a:number, b:number){ return a + b; } sum(10,20) //30 sum('10','20') ..