TypeScript

[타입스크립트] class의 getter와 setter

class User { firstName: string; lastName: string; fullName: string; constructor(firstName: string, lastName: string) { this.firstName = firstName; this.lastName = lastName; this.fullName = `${firstName} ${lastName}`; } } let user = new User("Steve", "Jobs"); console.log(user.fullName); //Steve Jobs console.log(user.firstName); //Steve user.firstName = "Jimmy"; console.log(user.fullName); //Steve..

[타입스크립트] 객체지향적 커피머신 만들기 : encapsulation

이전 포스팅 막판에 캡슐화를 통해서 커피머신 내부 변수값을 외부에서 새로 쓰는 것을 막아주어야 하는 필요성에 대해서 강조하였다. //public, //private, //protected 등의 키워드들을 이용해서 다양한 레벨의 정보들을 은닉화할 수 있다. 캡슐화는 내부적으로만 가져야 하는 값, 외부에서 접근 가능한 요소들을 분별해주는 작업이다. type CoffeeCup = { shots: number; hasMilk: boolean; }; class coffeeMachine { private static BEANS_GRAMM_PER_SHOT: number = 7; private coffeeBeans: number = 0; constructor(coffeeBeans: number) { this.coffe..

[타입스크립트] 절차지향적 커피머신 vs 객체지향적 커피머신

type CoffeeCup = { shots: number; hasMilk: boolean; }; const BEANS_GRAMM_PER_SHOT: number = 7; let coffeeBeans: number = 0; function makeCoffee(shots: number): CoffeeCup { if (coffeeBeans < shots * BEANS_GRAMM_PER_SHOT) { throw new Error("Not enough coffee beans!"); } coffeeBeans -= shots * BEANS_GRAMM_PER_SHOT; return { shots, hasMilk: false, }; } function addCoffeeBeans(shots: number) { coffee..

[타입스크립트 전용 예시] 객체지향 4가지 원칙

좋은 객체지향 프로그래밍이란, 가. 캡슐화가 잘 되어 있음 나. 뛰어난 추상성 다. 상속(코드 재사용) 가,나,다를 통해서 라. 다형성을 추구한다. 절차지향 프로그래밍에서는 데이터와 함수가 다 섞여있다. 여기서 관련이 있는 데이터와 함수들을 묶는 것을 '캡슐화'라고 한다. 또한 외부에 노출할 필요가 없는 데이터들을 잘 숨기는 것이기도 하다. (예시1 : 감기약의 예시, 환자들은 의사가 건네준 캡슐 감기약 하나만 먹으면 된다. 그 캡슐안의 가루가 어떤 성분들이 섞여 있는지는 몰라도 된다.) (예시2 : 고양이의 상태는 외부에서 직접적으로 변경할 수 없다.(슬픔, 아픔, 기쁨, 평온 등...) 단 주인이 놀아주고 먹이를 주는 등의 행위(외부 함수)를 가함으로써 고양이의 내부 상태에 변화를 주었다면 incap..

타입스크립트 로딩 상태 표시 예제

type LoadingState = { state: "loading"; }; type SuccessState = { state: "success"; response: { body: string; }; }; type FailState = { state: "fail"; reason: string; }; type ResourceLoadState = LoadingState | SuccessState | FailState; function printLoginState(state: ResourceLoadState) { switch (state.state) { case "loading": console.log("👀 loading..."); break; case "success": console.log("😃 loade..

타입스크립트 좌표 이동 예제

type direction = "up" | "down" | "left" | "right"; let position = { x: 0, y: 0 }; function move(dir: direction) { if (dir === "up") { position.y++; } if (dir === "down") { position.y--; } if (dir === "left") { position.x--; } if (dir === "right") { position.x++; } } console.log(position); // { x: 0, y: 0} move("up"); console.log(position); // { x: 0, y: 1} move("down"); console.log(position); //..

타입스크립트 계산기 함수 만들기

type calculateStr = "add" | "substract" | "multiply" | "divide" | "remainder"; function calculate(calStr: calculateStr, num1: number, num2: number) { if (calStr == "add") { return num1 + num2; } if (calStr == "substract") { return num1 - num2; } if (calStr == "multiply") { return num1 * num2; } if (calStr == "divide") { return num1 / num2; } if (calStr == "remainder") { return num1 % num2; } thr..

Union과 또 다른 Intersection 타입

Union이 Or이라면 Intersection은 And & 일 것이다^^ type Student = { name: string; score: number; }; type Worker = { employeeId: number; work: () => void; }; function internWork(person: Student & Worker) { console.log(person.name, person.employeeId, person.work()); } internWork({ name: "홍길동", score: 86, employeeId: 6, work: ()=> {}, }); //홍길동 6 undefined 위의 코드가 아래와 같다면, type Student = { name: string; score..

필수 타입! Discriminated Union

차별화(구분) 할 수 있는 Union 아래 코드를 개선해보자 type SuccessState = { response: { body: string; }; }; type FailState = { reason: string; }; type LoginState = SuccessState | FailState; function login(): SuccessState | FailState { return { response: { body: "logged in!", }, }; } function printLoginState(state: LoginState) { if ("response" in state) { console.log(`🎉 ${state.response.body}`); } else { console.log..

타입스크립트 1장 연습문제 | 타입스크립트의 추론

1. 타입스크립트의 추론 방식 알기 let a = 10423; //number let b = "apple"; //string const c = "grape"; //"grape" let d = [true, false, true]; //boolean[] let e = { 이름: "smith" }; //{ 이름: string } let f = [1, false, "홍길동"]; //(number | boolean | string)[] const g = [3]; //number[] let h = null; //any 2. 에러의 원인 파악하기 a. let i: 3 = 3; i = 4; ~ //'4'형식은 '3'형식에 할당할 수 없습니다. 원인 : i 변수를 명시적으로 오직 하나의 값을 나타내는 타입인 '타입리터럴..