[TypeScript] 7장 클래스

1. 클래스 (Classes) 와 상속(Inheritance)타입스크립트에서 클리스는 class 키워드로 정의되며, 상속은 extends 키워드를 사용해 구현합니다.class Animal { constructor(public name: string) {}}class Dog extends Animal { bark() { console.log(`${this.name} says woof!`); }}const dog = new Dog("Eddy");dog.bark(); // 출력: Eddy says woof!2. 접근 지정자 public: 모든 곳에서 접근 가능private: 클래스 내부에서만 접근 가능protected: 클래스와 그 자식 클래스에서 접근 가능.clas..

• format_list_bulleted Front-End/TypeScript
• · 2025. 2. 20.
• textsms

[Typescript] 6장 유니언 타입과 교차 타입

1.유니언 타입과 공통 필드유니언 타입은 여러 타입 중 하나를 가질 수 있는 타입으로, 공통 필드를 가진 유니언 타입을 만들 때 다음과 같이 정의할 수 있습니다.interface Cat { type: 'cat'; meow: () => void;}interface Dog { type: 'dog'; bark: () => void;}type Pet = Cat | Dog; 여기서 Pet 타입은 Cat 도는 Dog를 의미하며, 두 타입 모두 type이라는 공통 필드를 가지고 있습니다.2.유니언 구별하기유니언 타입을 구별하기 위해서는 타입 가드를 사용할 수 있습니다.function handlePet(pet: Pet) { if (pet.type === "cat") { pet.me..

• format_list_bulleted Front-End/TypeScript
• · 2025. 2. 18.
• textsms

[TypeScript] 5강 리터럴 타입

리터럴 타입(Literal Types)는 TypeScript에서 특정 값만을 가지는 타입을 정의해주는 기능입니다. 이를 통해 더 구체적이고 제한적인 타입을 만들수 있어, 코드의 안정성과 가독성을 향상시킬 수 있습니다. 리터럴 타입에는 문자열, 숫자, 불리언 등 다양한 기본 타입에 적용할 수 있습니다. 1. 문자열 리터럴 타입문자열 리터럴 타입에는 특정 문자열 값만을 허용하는 타입입니다. type Driver = 'left' | 'right' | 'up' | 'down' | 'break';function MoveEvent(direction: Driver) { console.log(`Moving ${direction}`);}MoveEvent('up'); // OKMoveEvent('break'); // O..

• format_list_bulleted Front-End/TypeScript
• · 2025. 2. 15.
• textsms

[TypeScript] 4강 함수

1. 함수타입스크립트의 함수는 Javascript와 마찬가지로 가명 함수(named function)과 익명 함수(anonymous function)로 만들 수 있습니다. 이를 통해서 API 함수 목록을 작성하거나 일회성 함수를 사용해 다른 함수로 전달해 애플리케이션에 가장 적합한 방법을 찾을 수 있습니다.// 가명 함수function add(x, y) { return x + y;}// 익명 함수let myAdd = function (x, y) { return x + y;}; 함수는 함수 외부의 변수를 참조할 수 없습니다. 이런 경우, 변수를 캡쳐(capture) 한다고 합니다. 이것이 어떤 방식으로 작동하는지 이해하려면 매커니즘이 어떻게 작동하는지 아는 것이 중요합니다.let z = 200;func..

• format_list_bulleted Front-End/TypeScript
• · 2025. 2. 13.
• textsms

[TypeScript] 3강 인터페이스

1. 첫 번째 인터페이스 (Our First Interface) 어떤 방식으로 인터페이스가 동작하는 지 간단하게 타입을 짜서 확인해볼 수 있습니다.function printInt(IntObj: { Int: string }) { console.log(IntObj.Int);}let myInt = { size: 10, Int: 'Size 20 Inter' };printInt(myInt); 타입 검사는 PrintInt 호출을 확인하고, PrintInt는 string 타입의 Int을 갖는 객체를 하나의 매개변수로 가집니다. 이 객체는 실제로 더 많은 프로퍼티를 갖고 있지만, 컴파일러는 최소한 필요한 프로퍼티가 있는지와 타입이 잘 맞는지만 검사합니다. interface LabeledValue { Int: str..

• format_list_bulleted Front-End/TypeScript
• · 2025. 2. 11.
• textsms

[Typescript] 2강 기본적인 타입 소개

1. 불리언 타입(Boolean)타입스크립트의 가장 기본적인 데이터 타입은 Javscript와 Typescript에서 사용하는 boolean 값이며 참과 거짓을 정의하는 값입니다. let isTrue: boolean = true;console.log(isTrue); // true 2. 숫자 (Number)타입스크립트는 자바스크립트와 같이 모든 숫자는 부동 소수 값으로, 부동 소수에는 number라는 타입이 붙혀집니다. Typescript는 16진수 ,10진수 리터럴에 더불어, ECMAScript 2015에 소개된 2진수, 8진수 리터럴도 지원합니다.let sixten: number = 6;let hexresult: number = 0x0042;let binary: number = 0b1010;let oc..

• format_list_bulleted Front-End/TypeScript
• · 2025. 2. 9.
• textsms