Web Front 개발공부/React.js
타입스크립트 기본 - Class와 Enum 타입
슬기로운 동네 형
2024. 7. 14. 09:49
반응형
회사에서 다음 프로젝트로 리액트를 사용하기로 했는데... 오잉 타입스크립트를 함께 사용한다.
타입스크립트가 무엇인지는 5~6년 전에 얕게 흩어보아 잘알고 있다.
리액트에서 사용할 때 큰 문제가 없도록 간단하게 공부하고 메모를 남긴다.
1. Class
티스트토리 코딩 첨부하기에 TypeScript가 생기다니 이런 좋은일이~~~
자바와 별반 다르지 않다. 다만 this 를 반드시 써야 에러가 안난다.
interface IUser{
name:string;
age:number;
sayHello:()=> string; //인수 없이 문자열 반환
}
class User implements IUser{
name: string;
age: number;
constructor(){
this.name = '';
this.age = 0;
}
sayHello(): string {
return `안녕하세요 저는 ${this.name} 이고 나이는 ${this.age} 입니다.`;
}
}
const user = new User();
user.name = 'Hana';
user.age = 30;
console.log(user.sayHello());
2. Enum 타입 열거형
Enum 역시 자바와 유사하다.
수치 기반 이외에 문자열 기반의 Enum을 사용할 때는 각 멤버를 특정한 문자열의 상수로 초기화해야 한다.
enum Direction2{
up,
Down,
Left,
Right
}
let direction: Direction2 = Direction2.Left;
//2 라는 숫자가 출력된다.
console.log(direction);
//문자사용시는 상수를 초기화한다.
enum Direction{
up = 'UP',
Down = 'DOWN',
Left = 'LEFT',
Right ='RIGHT'
}
// 예를 들어, API의 파라미터로 문자열이 전달된 경우를 가정한다.
const value = 'DOWN';
// 문자열에서 Enum 타입으로 변환한다.
const enumValue = value as Direction;
if(enumValue === Direction.Down){
console.log('Down is selected');
}
반응형