전체 글

[타입스크립트] 객체지향의 꽃 composition(부제: 상속의 문제점)

Favor Composition over inheritance "상속 대신에 컴포지션(뜻: 구성요소들, 구성)을 더 선호하세요." 타입스크립트 OOP의 꽃, composition을 다루기 전에 상속의 문제점에 대해서 먼저 알 필요가 있다. 미리 말하자면, composition은 복잡하게 상속의 수직 구조가 길어지는 대신에 상속의 레벨을 한 단계로만 유지할 수 있도록 도와주는 기법이다. 문제점도 미리 말하자면, composition용으로 가져다 쓰는 클래스와 가져오는 클래스 사이의 커플링이 너무 심하다는 점이 있다.( 가져다 쓰는 클래스를 변경하거나 다른 클래스로 바꾸고 싶다면, 가져다 쓰는 클래스와 연결된 모든 클래스에 들어가서 코드를 업데이트해야 한다.-> 더 확장이 쉽고 유연한 테크닉은 다음 포스팅을..

[타입스크립트] 다형성(polymorphism)이 뭐가 좋은 것일까?

포스팅 제목의 해답은 아래 코드에 있다. 아래 코드를 보고도, 짐작하기 어렵다면 포스팅 가장 아래에 기재해두었다! //힌트1 const machines = [ new CoffeMachine(25, 25), new CafeLatteMachine(15, 25, 25, "S1"), new saltCoffeeMachine(5, 10), new CoffeMachine(25, 25), new CafeLatteMachine(15, 25, 25, "S1"), new saltCoffeeMachine(5, 10), ]; machines.forEach((machine) => { console.log("------------커피머신 가동~!------------"); console.log(machine.makeCoffee(1..

[타입스크립트] 커피머신클래스 <-상속- 카페라떼머신클래스

커피머신 클래스가 다음과 같이 있다. type CoffeeCup = { orderShot: number; hasMilk: boolean; }; interface CoffeeMaker { makeCoffee(shots: number): CoffeeCup; } //위 인터페이스를 구현하는 클래스이다. class CoffeMachine implements CoffeeMaker { private static ONE_SHOT_CAPSULE: number = 3; private static ONE_CUP_WATER: number = 10; static makeMachine(beans: number, water: number): CoffeMachine { return new CoffeMachine(beans, wat..

[타입스크립트] OOP 다형성, 상속 개념 확실하게 정리

다형성 정의 : 다형성이란 하나의 이름(방법)으로 많은 상황에 대처하는 기법이다. 효과 : 개념적으로 동일한 작업을 하는 함수들에 똑같은 이름을 부여할 수 있으므로 코드가 더 간단해지는 효과가 있습니다. 이를 통해 코드의 재사용, 코드 길이 감소가 되어 유지보수가 용이하도록 도와준다. 위의 설명을 조금 더 풀어 설명하자면, 아래와 같다. 다형성은 [상속]에서 비롯되는 큰 장점이라고 생각하면 쉽다. 다형성은 상속을 통해 동일 이름임에도 그 기능을 변경하는 것을 가능하게 해준다. 다형성 : 같은 이름을 불렀는데 다른 형상을 하는 것(같은 동작이지만 다른 과정과 결과가 나옴) [클래스 상속] extends 클래스 상속을 잘 이용하면 공통적인 기능은 그대로 재사용하면서, 자식클래스에서만 조금 더 자식클래스에 특..

[타입스크립트] 제네릭 타입 별칭

type MyEvent = { target: T; type: string; }; type ButtonEvent = MyEvent; let myEvent: MyEvent = { target: "홍길동이벤트", type: "click", }; type TimedEvent = { event: MyEvent; from: Date; to: Date; }; function trggerEvent(event: MyEvent): void { console.log(event); } trggerEvent({ target: "황진이이벤트", type: "mouseover", }); 제네릭 타입 별칭 : 타입 별칭과 할당 기호(=) 사이에만 제네릭 타입을 선언할 수 있다. type MyEvent = { target: T; ty..

[타입스크립트] 2개 이상의 제네릭 적용해보기(추론, 명시, 프로미스 제네릭까지)

2개 이상의 제네릭 적용해보기 초안 function map(array: unknown[], f: (item: unknown) => unknown): unknown[] { let result = []; for (let i = 0; i U): U[] { let result = []; for (let i = 0; i < array.length; i++) { result[i] = f(array[i]); } return result; } : 인수 배열 멤버의 타입을 대변하는 T, 반환 배열 멤버 타입을 대변하는 U..

[타입스크립트] 함수호출 시그니처의 제네릭

function filter(array: T[], f: (item: T) => boolean): T[] { let result = []; // tslint:disable-next-line: prefer-for-of for (let i = 0; i boolean): T[] }; let names = [{ 이름: "smith" }, { 이름: "kate" }, { 이름: "max" }]; //1. T는 number로 한정됨 console.log(filte..