⚡️array 자료에 타입을 지정 array 자료에 타입을 지정하고 싶으면 string[] 이렇게 기입합니다. 하지만 보다 구체적으로 타입지정하고싶을 때가 있습니다. "첫 자료는 무조건 string, 둘째 자료는 무조건 number인 array" 이런 것도 가능합니다. tuple 타입 쓰면 됩니다. ⚡️Tuple 타입 tuple type은 array에 붙일 수 있는 타입인데 자료의 위치까지 정확히 지정할 수 있는 타입입니다. let 멍멍이 :[string, boolean] = ['dog', true]; [ ] 괄호 안에 타입 적으시면 tuple type이 됩니다. [ ] 안에 차례로 세부 타입을 기입하면 됩니다. 그럼 정말 첫 자료는 무조건 string, 둘째 자료는 무조건 boolean만 허용해주고 다..

⚡️react 프로젝트 설치는 이런 명령어를 사용 npx create-react-app 프로젝트명 --template typescript typescript 셋팅이 완료된 프로젝트 설치하는 방법 ⚡️기존 react 프로젝트에 타입스크립트만 더하고 싶을 때 npm install --save typescript @types/node @types/react @types/react-dom @types/jest 기존 프로젝트 경로에서 터미널을 오픈하신 후 입력해주면 끝입니다. 이제 .js 파일을 .ts 파일로 바꿔서 이용가능합니다. 이런거 할 바엔 깔끔하게 그냥 새로 프로젝트 만드는게 안전합니다. ⚡️프로젝트가 생성되고 TS 문법 사용 방법 1. 일반 프로젝트와 다른 점은 컴포넌트 파일은 js가 아니라 tsx로 ..

(문제1) 문자를 집어넣으면 문자의 갯수, array를 집어넣으면 array안의 자료 갯수를 콘솔창에 출력해주는 함수는 어떻게 만들까요? (조건) Generic을 이용해서 구현해보도록 합시다. (동작 예시) 함수('hello') 이렇게 사용하면 콘솔창에 5가 나와야합니다. 함수( ['kim', 'park'] ) 이렇게 사용하면 콘솔창에 2가 나와야합니다. 더보기 function 함수(x: MyType) { console.log(x.length) } 함수('hello'); 함수(['kim','park']) 1. 안에 타입을 집어넣을 수 있는 함수를 만들었습니다. 그리고 기능은 심플한데 x.length를 출력해줍니다. 2. 근데 에러가 납니다. x에 뭐가 들어올지 모르니까 미리 에러를 내주고 있습니다. 3...

⚡️ Generic이란? 타입을 인자로 받아서 타입을 리턴하는 함수 ⚡️함수 return 값의 타입이 불확실 할 때 예를 들어 1. 아무렇게나 생긴 array 자료를 입력하면 2. array의 첫 자료를 그대로 출력해주는 함수를 만들었다고 합시다. function 함수(x: unknown[]) { return x[0]; } let a = 함수([4,2]) console.log(a) console.log(a + 1) 1. 이러면 콘솔창에 4가 출력됩니다. 2. 마우스 올려서 a의 타입을 확인해보면 숫자는 아니고 unknown 타입입니다. 3. 지금 입력하는 array도 unknown 타입이라서 그렇습니다. ( 여기서 중요포인트는 타입스크립트는 타입을 알아서 변경해주지 않습니다. ) 4. 함수의 return..

(문제1) Car 와 Bike 타입을 index.ts에 만들어놨는데 서식이 복잡해서 다른 파일로 옮겨서 사용하고 싶습니다. 코드를 다른 파일에 저장하여 index.ts에서 가져와서 변수만들 때 사용해보십시오. (index.ts) type Car = { wheel : number, model : string } interface Bike { wheel : 2, model : string } 더보기 타입담아둘 파일 (post.ts) export type Car = { wheel : number, model : string } export interface Bike { wheel : 2, model : string } 가져다쓰는 파일 (index.ts) import {Car, Bike} from './a' l..

⚡️import export 하는 방법 만든 타입변수를 다른 파일에서 사용하고 싶은 경우 자바스크립트 import export 문법 그대로 사용가능합니다. post.ts -> get.ts 이렇게 변수나 함수를 가져다쓰고 싶은 경우 (post.ts) export var 이름 = 'kim'; export var 나이 = 30; (get.ts) import {이름, 나이} from './post' console.log(이름) 1. 우선 변수를 다른 파일에서 쓰이게 내보내고 싶으면 export 문법으로 내보내야하고 2. export된 변수를 가져와서 쓰고 싶으면 import 문법으로 가져와야합니다. export 하고 싶으면 변수나 함수 정의부분 왼쪽에 export 키워드 붙이면 되고 import 하고 싶으면 i..