[ Typescript ] 타입스크립트 Docs_Reference_Type Compatibility

공부한 내용을 정리한 글입니다 
내용에 오류가 있거나 더 좋은 의견이 있다면 댓글로 남겨주세요.
배움에 큰 도움이 됩니다. 🖋

 

 

Type Compatibility (타입 호환성)

---

어떤 타입이 다른 타입에 할당될 수 있는지를 나타내는 개념이다. 타입스크립트에서는 두 개의 객체가 동일한 속성과 타입 구조를 가지고 있다면 타입 호환성이 성립하며 이를 구조적 타이핑이라고 한다. 타입 호환성을 이용하면 코드의 유연성과 재사용성을 높일 수 있다.

 

interface User {
  id: number;
  name: string;
}

interface Admin {
  id: number;
  name: string;
  role: string;
}

let user: User = { id: 1, name: 'John' };
let admin: Admin = { id: 2, name: 'Alice', role: 'admin' };

user = admin; // Admin 타입은 User 타입에 할당할 수 있다.
admin = user; // Error: Property 'role' is missing in type 'User' but required in type 'Admin'.

 

Comparing two functions (두 함수 비교)

---

• 매개변수가 다른 두 함수

interface User {
  id: number;
  name: string;
  email: string;
}

let getUser = (id: number): User => {
  ...
  return { id, name: "Kelly", email: "kelly@gmail.com" };
};

let saveUser = (id: number, name: string) => {
  ...
};

saveUser = getUser; // 성공
getUser = saveUser; // 에러 : Type '(id: number, name: string) => void' is not assignable to type '(id: number) => User'
		    // Target signature provides too few arguments. Expected 2 or more, but got 1.

 

매개변수가 더 많은 함수에 더 적은 함수를 할당하는 것만 성공하는 이유는 자바스크립트에서 함수 호출 시 불필요한 매개변수를 무시하는 것이 일반적이기 때문이다. 

배열의 map() 메서드를 예로 들어보자.
map()의 콜백 함수 명세에서는 처리할 현재 요소, 요소의 인덱스, map()을 호출한 배열을 인자로 전달받지만, 실제 사용시에는 첫 번째 매개변수인 '인자로 처리할 현재 요소'만 활용하는 경우 또한 자주 발생한다.

 

 

• map 메서드

arr.map(callback(currentValue[, index[, array]])[, thisArg])

 

const numArr = [1, 2, 3];

const incrementedNums = numArr.map((num, idx, array) => {
  console.log(num);
  return num + 1;
});

const decrementedNums = arr.map(item => item - 1);

 

---

 

• 반환타입이 다른 두 함수

그러나 반환 타입이 다를경우에는 원본 함수의 반환 타입이 대상 함수 반환 타입의 하위인 경우(원본함수의 반환 객체 요소가 더 적을 경우)만 호환이 가능하다

const getUserInfo = () => ({ name: "Kelly" });
const getDetailedUserInfo = () => ({ name: "Kelly", age: 20 });

getUserInfo = getDetailedUserInfo; // 성공
getDetailedUserInfo = getUserInfo; // 오류, getUserInfo()에는 age 프로퍼티가 없습니다.

 

Enums (열거형)

---

Enum 값은 해당 Enum 타입과 Enum 값의 인덱스로 구성된 숫자 타입이다. 따라서 동일한 열거형 내의 값들은 호환된다.

하지만 열거형 타입은 각각 고유한 타입이기 때문에 다른 열거형 타입 과는 호환되지 않는다. 열거형 값의 인덱스가 다른 열거형의 값과 일치하지 않기 때문에 호환되지 않는 것으로 간주됩니다.

 

enum Status {
  Ready,
  Waiting,
}

enum Color {
  Red,
  Blue,
  Green,
}

let status = Status.Ready;
status = Status.Waiting; // 성공 : 동일한 열거형 내의 값에서 호환 가능
status = Color.Green; // 에러 : Type 'Color' is not assignable to type 'string'.

 

Class

---

인스턴스 멤버만 비교되며, static 멤버와 constructor는 호환성에 영향을 주지 않는다.

멤버 중 private, protected 멤버가 있다면 동일한 접근 제한자를 가져야 호환이 가능하다.

 

 

Generics

---

구조적으로 같을 경우 호환 된다.

 

interface Empty<T> {}
let x: Empty<number>;
let y: Empty<string>;
x = y; // 성공, y는 x의 구조와 대응하기 때문

 

interface NotEmpty<T> {
  data: T;
}
let x: NotEmpty<number>;
let y: NotEmpty<string>;
x = y; // 오류, x와 y 는 data의 타입이 다르기 때문에 호환되지 않는다

참고

---

https://www.typescriptlang.org/ko/docs/handbook/type-compatibility.html

Documentation - Type Compatibility