용성월드

CRA와 TS를 같이 만드는 경우 npx create-react-app my-app --template typescript CRA에서 TS를 추가하는 경우 npm install --save typescript @types/node @types/react @types/react-dom @types/jest eslint 설치 npm install @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint-config-prettier eslint-plugin-prettier prettier -D .eslintrc 설정 { "parser": "@typescript-eslint/parser", "extends": [ "prettier" ], "plugin..

npm install @types/node tsconfig.json tsc --init { "compilerOptions": { "target": "es5", "lib": [ "dom", "dom.iterable", "esnext" ], "allowJs": true, "skipLibCheck": true, "esModuleInterop": true, "allowSyntheticDefaultImports": true, "strict": true, "forceConsistentCasingInFileNames": true, "noFallthroughCasesInSwitch": true, "module": "esnext", "moduleResolution": "node", "resolveJsonModule": ..

타입 지정 타입스크립트는 일반 변수, 매개 변수(Parameter), 객체 속성(Property) 등에 : TYPE과 같은 형태로 타입을 지정할 수 있습니다. 타입 선언 불린: Boolean 숫자: Number 문자열: String 배열: Array 튜플: Tuple : 정해진 타입의 고정된 길이(length) 배열을 표현합니다. 열거형: Enum : 숫자 혹은 문자열 값 집합에 이름(Member)을 부여할 수 있는 타입 모든 타입: Any 알 수 없는 타입: Unknown 객체: Object Null과 Undefined Void : 일반적으로 값을 반환하지 않는 함수에서 사용합니다. Never : 절대 발생하지 않을 값을 나타내며, 어떠한 타입도 적용할 수 없습니다. 유니언(Union) : 2개 이상의..

크로스 플랫폼 지원: 자바스크립트가 실행되는 모든 플랫폼에서 사용할 수 있습니다. 객체 지향 언어: 클래스, 인터페이스, 모듈 등의 강력한 기능을 제공하며, 순수한 객체 지향 코드를 작성할 수 있습니다. 정적 타입: 정적 타입을 사용하기 때문에 코드를 입력하는 동안에 오류를 체크할 수 있습니다.(단 에디터 혹은 플러그인의 도움의 필요) DOM 제어: 자바스크립트와 같이 DOM을 제어해 요소를 추가하거나 삭제할 수 있습니다. 최신 ECMAScript 기능 지원: ES6 이상의 최신 자바스크립트 문법을 손쉽게 지원할 수 있습니다.

yarn add typescript ts-node 를 설치한다. ts-node 콘솔에서 바로 실시할수 있는 모듈 yarn run tsc --init 프로젝트의 타입스크립트 설정에 대한 파일이 완성된다. yarn run tsc typescript 에서 함수의 파라메터의 타입을 설정하지 않으면 any 로 설정된다. 결과값도 number로 받고 싶을 시 파라메터 뒤에 :number 타입을 적어준다.

컴포넌트의 타입 추론이 되니, 코드를 실행하지 않아도 IDE상에서 바로 알수있어서 오류를 방지할 수 있다. 자바스크립트 타입에 관련하여 몇가지 추가 되었다~ typescript-kr.github.io/ TypeScript 한글 문서 TypeScript 한글 번역 문서입니다 typescript-kr.github.io