TypeScript

프로젝트 생성 Vite로 프로젝트 생성하는 방법은 2가지가 있다 1. vite를 만들어주고 프레임워크랑 사용할 언어를 고르는 방법 npm create vite@latest yarn create vite 2. vite로 프레임워크랑 사용할 언어를 한번에 만드는 방법 // npm 6.x npm create vite@latest [프로젝트 명] --template react-ts // npm 7 버전 이상 npm create vite@latest [프로젝트 명] -- --template react-ts 마지막 부분 react-ts는 사용할 프레임워크와 언어에 따라 다르다 저는 2번 방법을 사용하여 프로젝트 세팅을 했습니다. npm 버전은 7버전 이상이라서 아래 명령을 사용했고 현재 폴더에 설치하기 위해 [프로..

제네릭 타입을 마치 함수의 파라미터처럼 사용하는 것 function toObj(a: T, b: T): { a: T; b: T } { // 재사용가능 return { a, b }; } toObj("a", "b"); toObj(1, 2); toObj(true, false); 타입변수를 명시적으로 넣어주지 않아도 된다. 그러나 첫번째 인수로 타입 추론을 하기 때문에 첫번째 인수와 타입이 다르면 에러가 발생한다 function toObj(a: T, b: T): { a: T; b: T } { // 재사용가능 return { a, b }; } toObj("a", 12); // 에러 발생 toObj(1, 2); // O toObj(true, false); // O 제약조건 제네릭을 더욱 안정적으로 사용할 수 있다 f..

추상 클래스 abstract(추상) : 클래스가 가져야 하는 실제적인 구현을 제외하고 클래스가 내부에서 가져야 되는 다양한 속성이나 메서드의 타입만 추상적으로 정의 추상 클래스는 class 앞에 abstract 키워드를 붙여줘야 한다 추상 클래스 vs 인터페이스 확장 : 추상 클래스는 extends 키워드 / 인터페이스는 implements 키워드 추상 클래스에서 확장할 클래스가 있으면 super()를 호출해야 한다 추상 클래스는 선언부와 구현부를 같이 포함할 수 있지만 인터페이스는 구현부를 포함할 수 없다 추상 클래스는 Is - A 관계로 extends 키워드를 통해 단일로 사용가능하다 class Dog extends AnimalA{} 인터페이스는 Has - A 관계로 implements 키워드 뒤에 ..

클래스의 접근 제어자 public 어디서나 해당하는 속성을 자유롭게 접근해서 사용할수 있다 생략 가능, Default 값 class Animal { public name: string; public sound: string; constructor(name: string, sound: string) { this.name = name; this.sound = sound; } } class Dog extends Animal { public color: string; constructor(name: string, sound: string, color: string) { super(name, sound); this.color = color; } speak() { return this.sound; } getColo..