typescript 핸드북 학습내용 정리 https://typescript-kr.github.io/pages/the-handbook.html 네임스페이스 첫번째 단계 단일 파일 검사기 interface StringValidator { isAcceptable(s: string): boolean; } let lettersRegexp = /^[A-Za-z]+$/; let numberRegexp = /^[0-9]+$/; //정규식 검사기 class LettersOnlyValidator implements StringValidator { isAcceptable(s: string) { return lettersRegexp.test(s); } } //우편번호 검사기 class ZipCodeValidator imple..

typescript 핸드북 학습내용 정리 https://typescript-kr.github.io/pages/the-handbook.html 모듈 해석 모듈 해석 (module resolution)은 컴파일러가 import가 무엇을 참조하는지 알아내기 위해 사용되는 프로세스. 첫번째로 모듈을 나타내는 파일의 위치를 찾고 못 찾으면 ambient 모듈을 찾으려고 함. 못 찾으면 오류 상대적 vs 비상대적 모듈 import 상대적 - 경로 지정됨 가져온 파일에 상대적으로 해석되고 ambient 모듈 선언으로 해석 될 수 없음 import Entry from "./components/Entry"; import { DefaultHeaders } from "../constants/http"; import "/mo..

typescript 핸드북 학습내용 정리 https://typescript-kr.github.io/pages/the-handbook.html 모듈 JS에서 모듈 로더는 CommonJS랑 RequireJS가 있었음. TS와 JS는 ECMA 2015 이후의 import, export를 활용함. Export 선언 Export 하기 모든 선언(변수, 함수, 클래스, 타입 별칭, 인터페이스)를 export할 수 있음. // StringValidator.ts export interface StringValidator { isAcceptable(s: string): boolean; } // ZipCodeValidator.ts import { StringValidator } from "./StringValidator"..

typescript 핸드북 학습내용 정리 https://typescript-kr.github.io/pages/the-handbook.html 유틸리티 타입 Partial T의 모든 프로퍼티를 선택적으로 만드는 타입을 구성함. interface Todo { title: string; description: string; } function updateTodo(todo: Todo, fieldsToUpdate: Partial) { return { ...todo, ...fieldsToUpdate }; } const todo1 = { title: 'organize desk', description: 'clear clutter', }; const todo2 = updateTodo(todo1, { descriptio..

typescript 핸드북 학습내용 정리 https://typescript-kr.github.io/pages/the-handbook.html 제네릭 사용자는 제네릭을 통해 여러 타입의 컴포넌트나 자신만의 타입을 사용할 수 있음 제네릭의 Hello World any를 써서 구현한 경우 function identity(arg: any): any { return arg; } 제네릭으로 구현한 경우 function identity(arg: T): T { return arg; } 타입변수 T는 유저가 준 인수의 타입을 캡처하고, 이 정보를 나중에 사용할 수 있게 함. // 두가지 호출 방법 // 명시적 선언 let output = identity("myString"); // 출력 타입은 'string'입니다. /..

typescript 핸드북 학습내용 정리 https://typescript-kr.github.io/pages/the-handbook.html 열거형 숫자 열거형 enum Direction { Up = 1, Down, Left, Right, } // 첫번째값만 지정하면 뒤는 자동으로 증가된 값을 갖는다. // Down = 2, Left = 3, Right = 4 enum Direction { Up, Down, Left, Right, } // 지정하지 않는 경우 0부터 시작한다. // Up = 0, Down = 1 ... enum Response { No = 0, Yes = 1, } function respond(recipient: string, message: Response): void { // ... ..

typescript 핸드북 학습내용 정리 https://typescript-kr.github.io/pages/the-handbook.html 유니언과 교차 타입 유니언 타입은 여러 타입 중 하나가 될 수 있는 값을 의미합니다. 세로 막대 (|)로 각 타입을 구분하여, number | string | boolean은 값의 타입이 number, string 혹은 boolean이 될 수 있음을 의미합니다. function padLeft(value: string, padding: string | number) { // ... } 공통 필드를 갖는 유니언 실제 대입된 쪽의 멤버들에게만 접근할 수 있음. interface Bird { fly(): void; layEggs(): void; } interface Fis..

typescript 핸드북 학습내용 정리 https://typescript-kr.github.io/pages/the-handbook.html 리터럴 타입 리터럴 타입 좁히기 const로 변수를 선언하게 되면 Typescript에게 이 객체는 절대 변경되지 않음을 알림 // 따라서, TypeScript는 문자열이 아닌 "Hello World"로 타입을 정합니다. const helloWorld = "Hello World"; // 반면, let은 변경될 수 있으므로 컴파일러는 문자열이라고 선언할 것입니다. let hiWorld = "Hi World"; 문자열 리터럴 타입 // 허용된 문자열이 아닌 다른 문자열을 사용하게 되면 오류 발생 type Easing = "ease-in" | "ease-out" | "e..

typescript 핸드북 학습내용 정리 https://typescript-kr.github.io/pages/the-handbook.html 함수 함수 (Function) // 기명 함수 fucntion add(x, y) { return x + y; } // 익명 함수 let myAdd = function(x, y) { return x + y }; // 함수는 함수 외부의 변수를 참조는 경우를, 변수를 캡처(capture) 한다고 함. let z = 100; function addToZ(x, y) { return x + y + z; } 함수 타입 (Function Types) 함수의 타이핑 (Typing the function) function add(x: number, y: number): number..

typescript 핸드북 학습내용 정리 https://typescript-kr.github.io/pages/the-handbook.html 인터페이스 첫 번째 인터페이스 (Our First Interface) interface LabeledValue { label: string; } function printLabel(labeledObj: LabeledValue) { console.log(labeledObj.label); } let myObj = {size: 10, label: "Size 10 Object"}; printLabel(myObj); 타입 검사는 프로퍼티들의 순서를 요구하지 않음. 단지 인터페이스가 요구하는 프로퍼티들이 존재하는지와 프로퍼티들이 요구하는 타입을 가졌는지만을 확인. 선택적 프로..