타입스크립트의 인터페이스

타입스크립트 Interface

자바에서의 인터페이스는 추상 메소드와 를 정의한 클래스를 위주로 다루지만, 타입스크립트에서는 객체를 위주로 다룬다는 점에서 차이가 있습니다.

인터페이스는 두개의 시스템 사이에 상호 간 정의한 약속 혹은 규칙을 포괄하여 의미하는데, 이는 객체의 껍데기 또는 설계도와 비슷합니다.

여거 개의 함수와 여러개의 변수 등이 구조적으로 어떻게 결합되어야 하는지에 대한 약속입니다.

interface Person {
  name: String;
  age?: number; //optional, 해당 속성은 명시해도 되고 안해도 된다.
  move(): void; //인터페이스에는 객체에 대한 정의 뿐만 아니라 함수에 대한 정의도 들어갈 수 있습니다.
}

var person1: Person = {
  name: "John",
  move: () => {}
};

var person2: Person = {
  name: "Mika",
  age: 40,
  move: () => {}
}

var person3: Person = {
  name: "Mika",
  age: true  // error 잘못된 타입
             // error move 함수가 반드시 있어야 함
}

콜론(:) 앞에 물음표(?)를 붙이면 해당 속성은 옵션 속성이 됩니다.

해당 age 속성은 선택속성이므로 해당하는 로직을 짜게 되면, 컴파일러가 age 속성이 확실하게 쓰였는지 추론을 할 수 없기때문에 에러를 내게 됩니다.

이는 타입 가드 기법을 사용해서 Person.age 속성이 존재할때만 조건식 비교를 하라고 로직을 짜야 합니다.

interface Person {
  name: String;
  age?: number; //optional
  move(): void;
}

var person1: Person = {
  name: "John",
  move: () => {}
};

if(person1.age && person1.age < 30) {
  console.log(person1.age)
}

읽기 전용 속성

읽기 전용 속성은 객체를 처음 생성할 때만 값을 할당가능하며, 그 이후로는 값이 바뀔수 없는 속성을 의미합니다.

interface ReadOnly {
  readonly test: string;
}

읽기 전용 배열

배열 선언시 ReadonlyArray 타입을 이용하면 읽기 전용 배열을 생성 가능하며, 선언후 배열 내부의 값들을 변경할 수 없습니다.

let arr: ReadonlyArray<number> = [1, 2, 3];
arr.splice(0, 1); // error
arr.push(4); // error
arr[0] = 100; // error
arr = [10, 20, 30]; // error