Type Script - 4

donggae·2023년 12월 16일
0

TypeScript

목록 보기
4/6
post-thumbnail

객체 타입간의 호환성

어떤 객체타입을 다른 객체타입으로 취급해도 괜찮은가에 대해

type Korea = {
	이름: string;
  	코드: number;
}

type Dokdo = {
	이름: string;
  	코드: number;
  	소속: string;
}

let korea: Korea = {
	이름: "대한민국",
  	코드: 82,
}

let dokdo: Dokdo = {
	이름: "독도",
  	코드: 82,
  	소속: "대한민국",
}

위와 같이 koreadokdo라는 객체가 존재한다
이떄 객체간의 호환성을 알아보자

dokdo = korea

  • 위의 코드는 오류를 발생한다 왜 일까?

나는 처음에 이것을 보고 프로퍼티가 더 있기에 이것이 더 큰 포함이라 생각을 했었지만, dokdo객체는 korea객체가 가지는 프로퍼티를 포함하고 추가적인 프로퍼티가 있기에 korea객체가 더 큰 집합이라고 볼 수 있다
따라서 korea = dokdo 가 맞는 코드인 것이다.

프로퍼티가 적은(조건이 더 적은) 타입이 슈퍼타입인 것이다.

대수 타입

여러개의 타입을 합성해서 새롭게 만들어낸 타입
이 타입에는 합집합, 교집합이 존재한다.

합집합(Union) 타입

| 를 이용하여 유니온 타입을 정의할 수 있다.

let union :string | number | boolean;
let number: number = 10;

union = "이렇게 문자도 쓸 수 있고";
union = 1234;
union = "이렇게 숫자도 쓸 수 있고";
union = true;
union = "이렇게 참 거짓도 쓸 수 있다";

교집합(Intersection) 타입

&를 이용하여 인터렉션 타입을 정의할 수 있다.

let value: number & string;

숫자타입과 문자타입의 공통적인 요소가 있을까?
-> 존재하지 않는다. 그렇기에 never 타입으로 추론이 된다.
대체적으로 기본 타입들에는 서로 공통적인 요소가 없기에 인터렉션 타입은
보통 객체 다팁들에 자주 사용된다.

그럼 이제 객체에서의 인터렉션 타입을 알아보자

type Dog = {
	name: string;
	old: number;
};

type Person = {
	name: string;
	birth: string;
};

type Intersection = Dog & Person;

let intersection1: Intersection = {
	name: '',
	old: 1,
	birth: '',
};
  • 서로의 공통된 집합만을 타입으로 가질 수 있다.

타입 추론

타입스크립트는 정의가 되어있지 않은 변수의 타입을 자동으로 추론한다.
변수의 초기값을 통해 추론을 할 수 있다.

타입 추론이 가능한 상황들에 대해 알아보자

1. 변수선언

변수 선언의 경우 초기값을 통해 타입을 추론한다.

let num = 10;
// number 타입으로 추론

let str = "string";
// string 타입으로 추론

let book = {
  	name: 'Deep Dive',
  	price: 20000,
  	lang: 'JavaScript',
}
// 각각의 name, price, lang은 초기값을 통해 각각의 타입을 가지는 객체로 추론

2. 구조 분해 할당

let {name, price, lagn} = book;

let [one, two, three] = [1, true, "string];
  • 위와 같이 객체, 배열을 구조 분해 할당을 하여도 타입이 추론이 가능하다.

3. 함수의 반환값, 함수에서의 매개변수

function func() {
	return "TS Study";
}
  • 위와 같은 함수 반환값의 타입은 return 문을 기준으로 추론이 된다.
function func(ts = "TS Study") {
	return "TS Study";
}
  • 기본값이 설정이 된 매개변수의 타입은 기본값을 기준으로 추론이 되지만,
    기본 값이 설정이 되지 않으면 오류를 발생시킨다.

암시적 any Type

let any;
  • 위와 같은 코드가 있다고 생각을 해보자 이는 초기값이 없기에 any 타입으로 추론이 된다.
  • 여기서 변수를 추가 할당해보자
let anyValue;

anyValue = 9;
Math.sqrt(anyValue);
anyValue.toFixed();

anyValue = anyValue.toString();
anyValue.toUpperCase();
anyValue.toFixed(); // 오류 발생 
  • toFixed 가 위에선 오류가 없고 밑에선 오류가 생길까?
  • 이는 암시적으로 any 타입으로 추론을 하기 때문이다.
  • 두번째 줄에서 anyValue 에 넘버타입의 값을 넘겨줘서 그 이후부터는 anyValue 를 number 타입으로 추론을 하기 시작
  • anyValue 를 문자열로 바꾸게 되면 문자 타입으로 추론 그렇기에 number타입에 사용하는 메서드인 toFixed 가 오류를 발생 시키는 것이다.
profile
아자자자

0개의 댓글