바보같은 타입스크립트를 위한 Satisfies

Namu CHO
5 min readNov 8, 2024

--

as와 비교하며 사용합시다.

바보같은 타입스크립트!

타입스크립트를 사용하다 보면 때로는 그 엄격한 타입 검사가 불편하게 느껴질 때가 있습니다.

특히 객체에 여러 속성을 추가해야 하는데 타입을 모두 맞춰야 하는 경우나 특정 타입 규격을 어느 정도 만족시키면서도, 추가적인 속성을 넣고 싶을 때 곤란해집니다. 이런 상황에서 개발자들은 종종 우회 방법을 찾다가 타입스크립트가 “바보같이” 느껴지기도 합니다.

satisfies란?

as 구문을 사용할 때와 비슷해 보이지만, satisfies는 타입스크립트의 타입 검사 방식에 더 엄격한 제약을 부여합니다.

일반적으로 타입 단언(as)은 특정 타입으로 강제 변환하여 타입스크립트가 타입 검사를 건너뛰도록 합니다.

반면, satisfies는 타입 검사에서 주어진 타입을 "충족하는지" 확인하면서도 타입의 세부적인 부분을 유지할 수 있습니다.

예를 들어, 특정 인터페이스에 대한 규격을 만족하면서도 특정 속성의 타입을 더 구체적으로 지정하고 싶을 때 satisfies를 사용할 수 있습니다.

satisfies를 사용하지 않는 경우의 예제

타입스크립트는 객체에 대해 굉장히 엄격한 타입 검사를 수행합니다. 이런 타입 시스템은 오류를 미리 방지하는 데 좋지만, 상황에 따라서는 불필요하게 느껴질 수 있습니다. 예를 들어, 다음과 같이 타입 검사에 걸려 불편한 상황이 생길 때가 있습니다.

type Animal = {
name: string;
age: number;
};

const myDog = {
name: "Buddy",
age: 3,
breed: "Golden Retriever"
} as Animal;

위 코드에서 myDog 객체는 Animal 타입으로 선언된 nameage를 포함하고 있지만, breed라는 추가 속성도 포함하고 있습니다.

타입스크립트는 as 키워드로 타입을 단언할 때 이러한 추가 속성을 무시합니다. 따라서 이 객체가 Animal 타입을 만족하는지 여부는 완전히 검사되지 않습니다.

이는 오히려 타입스크립트의 강력한 타입 검사의 이점을 상실하게 만듭니다. 즉, 타입스크립트의 타입 검사가 불필요하게 느슨해져서 “바보”처럼 작동하는 느낌을 주게 됩니다.

satisfies를 사용한 경우

위와 같은 상황에서 satisfies를 사용해 보겠습니다.

type Animal = {
name: string;
age: number;
};

const myDog = {
name: "Buddy",
age: 3,
breed: "Golden Retriever"
} satisfies Animal;

이제 타입스크립트는 myDog 객체가 Animal 타입을 만족하는지 검사하면서도, breed 속성이 추가되어 있다는 것을 인식합니다.

satisfies 키워드를 사용하면, myDogAnimal 타입의 규격을 충족하면서도 원래의 타입을 유지하게 됩니다.

satisfies 사용의 장점

1. 타입 안전성 유지

as를 사용하면 타입스크립트는 타입을 강제로 변환하여 타입 안정성을 희생할 수 있습니다.

반면 satisfies는 타입을 "충족"하는지 검사하므로 강제 변환의 위험을 줄일 수 있습니다.

2. 추가적인 타입 보호

as는 불필요한 속성을 무시하지만, satisfies는 타입을 확장하면서도 타입 체크를 엄격하게 적용합니다.

이는 타입스크립트가 객체의 모든 속성을 검토할 수 있게 하여 잠재적인 오류를 미리 방지하는 데 유리합니다.

3. 더 구체적인 타입 정보 제공

as와 달리 satisfies는 타입이 더 구체적으로 정의될 수 있도록 지원합니다.

예를 들어, 특정 API 응답 객체의 구조를 확인하면서도 타입의 유연성을 유지해야 할 때 유용합니다.

satisfies가 해결하는 주요 불편함

  1. 추가 속성 허용과 타입 안전성 유지
    satisfiesas와 달리 객체가 가진 모든 속성을 유지하면서도 타입 안전성을 보장합니다. 추가 속성을 허용하되, 요구되는 타입 규격을 충족시키는지를 타입스크립트가 엄격하게 검사합니다.
  2. 정확한 타입 검사
    satisfies는 객체가 요구하는 타입의 조건을 만족하는지 확인하면서 추가된 속성들을 무시하지 않으므로, 타입 시스템이 실수로 잘못된 타입을 허용하지 않게 돕습니다.
  3. 유연하고 간결한 코드 작성 가능
    satisfies는 타입 단언의 장점과 타입 검사의 엄격함을 모두 가지므로, 코드가 더욱 유연해지면서도 가독성을 해치지 않습니다. 특히, 추가 속성이 필요할 때 satisfies를 사용해 객체를 쉽게 확장할 수 있습니다.

실제 예제: API 응답 타입 검사

REST API 응답을 처리할 때 객체의 타입을 안전하게 지정할 수 있습니다.

type ApiResponse = {
data: {
id: number;
name: string;
};
status: string;
};

const response = {
data: {
id: 1,
name: "John Doe",
extraInfo: "Not necessary"
},
status: "success"
} satisfies ApiResponse;

위의 예제에서 extraInfo 속성은 ApiResponse 타입에는 포함되지 않지만, satisfies를 사용하여 타입 안정성을 유지하면서 extraInfo 속성을 포함할 수 있게 됩니다.

만약 as를 사용했다면 타입스크립트는 extraInfo 속성에 대한 타입 검사를 수행하지 않고 무시했을 것입니다.

결론

assatisfies를 적절히 비교하며 사용할 때, 타입스크립트의 진정한 강점을 더 잘 활용할 수 있습니다.

이제 "바보같은 타입스크립트"에서 벗어나, 더욱 똑똑하게 타입스크립트를 활용해봅시다!

--

--

Namu CHO
Namu CHO

Written by Namu CHO

외노자 개발자 나무 🇸🇬

No responses yet