[TypeScript] TypeScript란? (2/2)

Enum

'열거형'이라는 것인데 이걸로 숫자나 문자의 집합체를 만들 수 있다. enum을 사용하면 값을 읽기 쉽고 오타를 미연에 방지할 수 있다. 하지만 enum은 컴파일러가 ts를 js로 변환할 때 객체를 생성하는데, enum을 많이 사용하지 말아야 할 이유가 이 블로그에 잘 정리되어있다.

 

-숫자형 enum

enum Animal {
  Cat = 1,
  Dog = 2,
  Rabbit = 5,
}

auto-incrementing 으로 자동으로 0에서부터 1씩 증가하며 적용된다. 위처럼 직접 지정할 수도 있다.

 

-문자형 enum

enum Animal {
  Cat = 'cat',
  Dog = 'dog',
  Rabbit = 'rabbit',
}

http 요청 방식과 같은 외부에서 가져온 값을 다루기 위해 많이 사용한다.

 

 

Interface 와 type의 차이

//interface
interface User {
	name: string;
	age: number;
}

//type
type User = {
	name: string;
	age: number;
}

type과 거의 비슷한 역할을 한다. 이름 첫 글자를 대문자로 짓는 것이 관례이다. 정의된 프로퍼티를 모두 작성해야 하지만 ? 연산자를 사용하여 선택적으로 만들 수도 있다 ( name?: string ). 

 

interface의 특징으로는 확장을 위한 extends 기능이 있다. 

interface Dog {
	name : string,
}

interface Cat extends Dog {
	age : number
}
//extends 기능을 이용하여 d 의 속성을 복사하여 name과 age를 모두 가진 c를 만들었다.

let dog :Dog = { name : 'dudu' }
let cat :Cat = { name : 'coco', age : 5 }

적당하고 간단한 예시가 안 떠올라 dog와 cat을 썼지만 extends의 왼쪽 타입이 오른쪽 타입에 포함되는 형태로 사용하면 좋지 않을까. '개발자 extends 직업' 같은...

 

type과 interface의 가장 큰 차이는 interface는 중복 선언이 가능하다는 것 (type은 불가). 

interface person {
	name : string,
}
interface person {
	school : string
}

//중복선언을 해주었으므로 person은 name과 school을 둘 다 가진다.

타입에 요소를 더 쉽게 추가할 수 있다.

 

 

Type Aliases

타입에 새로운 이름을 부여하여 참조하는 것이다. 가독성, 재사용성이 높아진다.

type Person = string;
let friend :Person = 'kim';
let student :Preson = 'park';

 

 

Type Interence

타입 추론이라 한다. 타입스크립트에서는 타입을 명시적으로 직접 지정하지 않으면 타입스크립트가 알아서 내 코드를 보고 타입을 정해주는데, 덕분에 타입을 사용하는 모든 코드에 타입을 직접 지정해줄 필요가 없지만, 타입을 잘못 추론해서 정해주는 경우 의도한 바와 다른 오류가 날 수 있기 때문에 애매한 코드는 직접 지정해주는 것이 좋다. 

 

 

TypeScript의 class

class Animal {
    //constructor의 멤버들 타입 명시
    명칭 :string;
    개체수 :number;
    우리 :string;
    
    //받는 인자 타입 명시
    constructor(name :string, population :number, area :string){
        this.명칭= name;
        this.개체수= population;
        this.우리= area;
    }
    noFood(){
        return `${this.명칭}에게 먹이를 주지 마시오.`;
    }
}

console.log(기린.noFood()); //기린에게 먹이를 주지 마시오

extends로 상속 가능.

공개 여부에 따라 public, private 키워드 명시 가능.

class Animal {
    //constructor의 멤버들 타입 명시 부분에 public, private 키워드 추가 가능
    public 명칭 :string;
    public 개체수 :number;
    private 우리 :string;
    
    (... 생략 ...)
    
}

readonly 키워드 : 값 변경 불가

 

 


참고자료

  • 코드스테이츠 교육자료

'SW공부 > TypeScript' 카테고리의 다른 글

[TypeScript] TypeScript란? (1/2)  (0) 2023.05.30