Hello Hyonie World!

📝 제약조건(Constraints / keyof) 제네릭에는 원하지 않는 속성에 접근하는 것을 막기 위해 extends 키워드를 이용해 제약 조건(Constraints)을 사용할수 있다. 1. Constraints: 특정 타입들로만 동작하는 Generic 함수를 만들 때 사용한다. 2. Keyof: 두 객체를 비교할 때 사용한다. ✔ Constraints 제네릭 제약조건은 존재하지 않는 속성에 접근하는 것을 막기 위해 사용한다. 키워드는 extends이며 특정 타입들로만 동작하는 제네릭 함수를 만들고 싶을 때 사용한다. Generic T에 제약 조건을 설정할 때 사용한다. (문자열 or 숫자) 제약 조건을 벗어나는 타입을 선언하면 에러가 발생한다. extends 키워드를 통해 string과 number에..

📝 제네릭 ⭐ 제네릭은 코드를 작성할 때가 아니라 코드가 수행될 때 타입을 명시할 때 사용한다. 제네릭이란 어떤 함수나 클래스가 사용할 타입을 생성 단계가 아닌 사용 단계에서 정의하는 프로그래밍 기법이다. 즉 타입을 명시할때 선언 시점이 아닌 생성 시점에 명시하여 하나의 타입으로만 사용하지 않고 다양한 타입을 사용할 수 있다. 일반적인 정적 타입 언어는 함수나 클래스를 정의할 때 타입을 선언해야 하지만, 제네릭을 이용해 코드가 수행될 때 타입이 명시되도록 하는 것이다. 제네릭(Generic)이란 데이터 타입을 일반화한다는 것을 의미한다. 정적 type 언어의 경우 클래스나 함수를 정의할 때 내부 데이터 타입을 정의 시점에서 type을 강제적으로 선언해야한다. 하지만, 제네릭을 사용한다면 클래스나 함수에서..

nullish coalescing operato nullish coalescing operator은 null병합 연산자라고 불린다. es2020에서 추가된 문법이며 A ?? B 와같이 표기한다. 좌항이 null, undefined인 경우에만 B를 리턴한다. null이나 undefined가 아니면 A를 리턴한다. 기존에 nullish coalescing operator을 사용하지 않았던 경우에는 A || B 의 or 논리연산자를 사용했다. A가 falsy(0, '', -0, NaN 등)한 값인 경우 B를 반환하고 아니면 A를 반환하는 연산자이다. nullish coalescing operator 등장한 이유는 null, undefined를 제외한 falsy값을 그대로 리턴하고 싶은 경우 사용하기위함이다. ..

Optional Chaining 접근하는 객체의 프로퍼티가 null 또는 undefined일 수 있는 optional property인 경우 if문을 사용하지 않고 넘어가게 하는 체이닝 문법이다. if문을 작성하지 않고 다음으로 넘어가게 하려면 객체 체이닝할때, 앞에 물음표를 작성하면된다. data?.property 프로그래밍 언어에서 물음표(?)는 optional 하다. 즉, 존재할수도 있고 존재하지 않을수도 있다. 라는 의미로 이해하면된다. es2020에서 추가된 문법이며 객체가 null 또는 undefined이면 undefined를 리턴하고 그렇지않은 경우 데이터 값을 리턴한다. optional chaining으로 빈번하게 등장하는 null, undefined체크 시 간결한 코드를 작성할 수 있다...

Type Guard 타입 가드는 데이터의 타입을 알 수 없거나 될 수 있는 타입이 여러 개라고 가정할 때 조건문을 통해 데이터의 타입을 좁혀나가는 것 데이터의 타입에 따라 대응하여 에러를 최소화할 수 있고, 타입을 통해 '가드'하는 코드라고 해서 타입 가드라고 한다. 타입 카드를 통해서 방어적인 코드를 짤 수 있다. 📝 구별된 유니온(Discriminated Union) elice 변수가 Human인지 Dog 타입인지 확신할수 없기 때문에 elice.think() 메서드를 호출 하거나 elice.bark()메서드를 호출하면 에러가 난다. 이때 타입스크립트가 타입을 추론할 수 있도록 단서를 준다. 타입을 추론할 수 있도록 단서를 주는 유니온 타입을 구별된 유니온 타입이라고 한다. 타입을 구별할 수 있는 단..

기존 타입, 인터페이스의 변경은 이미 그 타입을 사용하고 있는 코드에 모두 똑같은 변경을 가해줘야한다. 만약 해당 타입을 쓰는 모든 코드에 변경을 가하지 않고 특정 코드만 자유롭게 타입을 확장하고 싶을 땐 인터셉션 타입과 유니언 타입을 사용하면 된다. 🤓 Intersection ▶ And A타입이면서 B타입(A&B) Union ▶ Or A타입, B타입 둘 중 하나(A|B) 📝 Union Type 유니언 타입은 여러 타입 중 하나가 올 것이라고 가정할 때 사용한다. 유니언 타입은 세로 막대바를 사용 '|' 유니언 타입을 사용하면 TypeA, TypeB가 있을 때 A | B는 A와 B 둘중 하나라는 의미를 나타냄 one:string이거나 number 둘중 하나 Union과 Generic 공통점은 모두 여러 ..

📝 일급 객체(first-class object) JavaScript와 TypeScript 함수는 일급 객체이다. 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 일급 객체라고 한다. 자바스크립트 함수는 다른 함수에 매개변수로 제공할 수 있다. 📝 일급 객체의 충족 조건 다른 함수에 매개변수로 제공할 수 있다. 함수에서 반환 가능하다 변수에 할당 가능하다. let hyonie = function(func){ func(); } hyonie(function(){ console.log('coding') // "coding" }) 자바스크립트 함수는 함수에서 반환이 가능하다. function hyonie() { return function() { console.log('coding'); //"..

📝 strategy 또는 전략 패턴 이란? strategy pattern 또는 전략 패턴이란 객체가 할수 있는 행위들을 각각 전략으로 만들어 놓고, 동적으로 행위의 수정이 필요한 경우 전략 객체를 새로 생성하여 변경 주입하고 다른 행위가 가능하도록 만든 디자인 패턴이다. 디자인 패턴 활용 사례 VendingMachine 클래스가 존재하고 pay() 메소드 안에 "cash pay!"가 호출되도록 구현 되어있다. 만약 pay() 메소드의 console에 cash가 아닌 다른 텍스트가 출력되어야 한다면 메소드 내에 코드 수정 문제가 생긴다. 이는 OOP 설계원칙 중 하나인 OCP(Open Closed Principle) 수정에는 닫혀있다는 원칙에 위배된다. 또는 시스템이 커져서 확장 될 경우 pay() 메서드..

📝 인터페이스란 코드 내 계약(약속, 규칙)을 정의하는 강력한 방법이다. 인터페이스는 일반적으로 변수, 함수, 클래스에 타입 체크를 하기 위해 사용된다. 추상클래스와 동일하게 인터페이스도 직접 인스턴스를 생성할 수 없고, 모든 메소드가 추상 메소드이다. 인터페이스에서는 추상클래스의 추상 메소드와 달리 abstract 키워드는 사용하지 않는다. ES6는 인터페이스를 지원하지 않지만 TypeScript는 인터페이스를 지원한다. 예를 들면 아래 elice 변수는 Person 인터페이스의 계약을 준수해야만 한다. interface Person { name: string, age: number } let elice: Person = {name:"hyonie", age:20}; 📋 인터페이스를 사용하는 이유 타입의..

📝추상 클래스(abstract class) 추상 클래스는 다른 클래스들이 파생될 수 있는 기초 클래스를 말한다. 추상 클래스는 직접 인스턴스화를 할 없는 클래스입니다. 불가능!🙅🏻‍♀️ abstract 키워드는 추상 클래스 또는 추상 클래스 내에서 추상 메소드에 정의할때 사용한다. 추상 메소드는 클래스에는 구현되어 있지않고, 파생된 자식 클래스에서 구현이 필수이다. abstract 키워드를 이용해 Animal 추상 클래스와 makeSound 추상 메서드가 선언되었다. 추상 메소드는 클래스에 구현되어 있지 않기 때문에 파생된 클래스에서 구현해야 한다. 즉, 추상 클래스는 사용을 위해서는 상속을 강제하는 클래스이다. Animal 클래스는 추상 클래스 이기 때문에 animal 변수에 직접적으로 선언을 하게 되..