Nomad coder
[TypeScript] Nomad Coder - TypeScript 2주 챌린지(9일차)
타입스크립트 프로젝트 설정 명령어들 npm i -D typescript // devDependencies에 설치 tsconfig.json 파일 생성 // tsconfig.json { "include" : [ // 자바스크립트로 컴파일하고 싶은 모든 디렉터리 "src" ], "compilerOptions": { "outDir": "build", // 자바스크립트 파일이 생성될 디렉토리를 지정 "target": "ES3", // 어떤 버전의 자바스크립트로 타입스크립트를 컴파일하고 싶은지를 나타냄 "lib": ["ES6", "dom"], // 어떤 API를 사용하고 어떤 환경에서 코드를 실행하는지 알려줌, 배열에 넣어두면 해당 기능의 자동완성 기능을 사용할 수 있게 해줌 "strict": true, // 모든..
[TypeScript] Nomad Coder - TypeScript 2주 챌린지(6일차)
type에 특정값을 넣어서 지정해줄 수 있다. type Team = "red" | "blue" | "yellow" // 타입에 특정값을 넣을 수 있다. type Health = 1 | 5 | 10 interface Player { nickname: string, team:Team, health: Health } const nico : Player = { nickname: 'nico', team : "red", // 미리 지정해둔 특정값이 아닌 다른 값을 넣게되면 오류가 발생한다. health : 5 } interface? 인터페이스는 오직 오브젝트의 모양을 특정해주는 용도만을 가지고 있다. (TypeScript에서만 사용) React.js를 이용해 작업할 때 많이 사용된다. 또한, 인터페이스는 클래스 형..
[TypeScript] Nomad Coder - TypeScript 2주 챌린지(5일차)
TypeScript로 객체지향 프로그래밍하기 abstract class User { // 추상 클래스 constructor ( protected firstName:string, // protected, private, public의 차이를 잘 이해하자 private lastName:string, public nickname:string ) {} abstract getNickName():void // 추상 메소드 call signature만 가지고 있다 getFullName(){ // 메소드에도 protected, private, public을 넣어줄 수 있다. 안적었다면, public 상태 return `${this.firstName} ${this.lastName}` } } class Player ext..
[TypeScript] Nomad Coder - TypeScript 2주 챌린지(4일차)
다형성(polymorphism) poly = many, several, much, multy를 의미 morphos, morphic = form, structure를 의미 이것을 합쳐서 polymorphism은 여러가지 다른 구조들, 여러가지 다른 형태들이란 의미다. type SuperPrint = { (arr : number[]) : void (arr : boolean[]) : void (arr : string[]) : void } const superPrint : SuperPrint = (arr) => { arr.forEach(i => console.log(i)) } superPrint([1, 2, 3, 4]) superPrint([true, false, true]) superPrint(["a", "b..
[TypeScript] Nomad Coder - TypeScript 2주 챌린지(3일차)
Call Signatures 함수에 대한 타입을 만들 수 있고, 함수가 어떻게 작동하는 지 서술할 수 있다. 즉, 함수의 인자(arguments)의 타입과 함수의 반환 타입을 정해줄 수 있다. type Add = (a:number, b: number) => number // 이러한 형식을 call signatures 라고 불림 const add:Add = (a,b) => a+b Overloading 오버로딩은 함수가 여러개의 Call Signatures를 가지고 있을 때 발생시킨다. 예시1. type Config = { path: string, state: object } type Push = { (path: string): void (config: Config): void } const push:Pus..
[TypeScript] Nomad Coder - TypeScript 2주 챌린지(2일차)
타입스크립트의 타입들 우선 object의 타입을 정의해줄 때, 선택적 변수를 지정하는 방법은 아래 예시와 같다. const player : { name: string, age?: number, // optional하게 사용하고 싶은 값에 ?를 붙여준다. } = { name: "nico", } age의 경우 number | undefined 값을 주어주는데 if (player.age && player.age ({name}) const nico = playerMaker("nico") nico.age = 12 // optional한 값을 지정해줄 수 있다. readonly 속성 readonly 속성은 요소들을 '읽기 전용'으로 만들어 주는 것이다. JavaScript에서는 없는 동작으로 TypeScript에서..
[TypeScript] Nomad Coder - TypeScript 2주 챌린지
Typescript 챌린지 (2주) 진도표 1 주차 월 | Assignment # 01 ✍️ #1.5 ~ #2.1 ✔️ 퀴즈 화 | Assignment # 02 ✍️ #2.2 ~ #2.4 ✔️ 퀴즈 수 | Assignment # 03 ✍️ #3.0 ~ #3.1 ✔️ 퀴즈 목 | Assignment # 04 ✍️ #3.2 ~ #3.4 ✔️ 코드 챌린지 금, 토 | Assignment # 05 ✍️ #4.0 ~ #4.1 ✔️ 코드 챌린지 (2일) 일 🌴 휴일 2 주차 월 | Assignment # 06 ✍️ #4.2 ~ #4.4 ✔️ 퀴즈 화, 수 | Assignment # 07 ✍️ #4.5 ✔️ 코드 챌린지 (2일) 목 | Assignment # 08 ✍️ #5.0 ~ #5.4 ✔️ 퀴즈 금 ~ 일 | ..