Typescript as 대신 satisfies 사용하기

안녕하세요! 

저번에 타입스크립트에서 as 키워드에 관해서 알아보겠습니다.

하지만 저번에 언급했듯 as 키워드는 실제 타입에 무관한 값이 들어가 있거나 혹은 그 타입을 충족하지 못하거나 않는 값이 들어가 있어도 받아들이기 때문에 사용하는데 주의를 요하는 키워드입니다. 이러한 문제를 보안할 수 있는 다른 키워드가 있습니다.

이 키워드는 현재 3-4개월 전에 나온 키워드입니다.  이는 satisfies라는 키워드입니다.

오늘은 그럼 satisfies라는 키워드가 어떻게 동작하고 어떻게 사용하면 되는지 짧게 알아보겠습니다.

글을 읽어보시고 공부하시는 것도 좋지만 가장 좋은것은 직접 손으로 타이핑하여 결괏값을 보는 것입니다!

그러니 가능하다면 따라서 코드를 쳐보시기 바랍니다!!

 

1. as 대신 satisfies.
2. 사용방법과 주의점.
3. 마치며.

 

 

1. as 대신 satisfies.

satisfies라는 키워드는  타입스크립트 4.9 버전에서 등장하는 새로운 키워드입니다.

이는 타입을 선언할 때 사용하는 키워드입니다

앞서 언급하였듯이 as 키워드 또한 타입을 선 헌 할 때 사용되는 키워드이지만 이는 자칫 잘못이용하면 상당히 위험할 수 있는 키워드입니다.

예시를 보겠습니다.

 

type Person = {
  name: string;
  age: number;
  hobby: string;
};

const per1: Person = {
  name: "John",
  age: 20,
  hobby: "computer game",
};
const per2 = {
  name: "Max",
  age: 22,
} as Person;
const per3 = {
  name: "Kai",
  age: 25,
  hobby: "baseball",
} satisfies Person;

자 이렇게 Person이라는 타입을 지정해 주었습니다. 이는 각각의 name, age  그리고 hobby의 타입을 나타내고 있습니다.

첫 번째 per1의 경우 가장 기본적이고 많이 사용되는 방법입니다. 

변수 다음에 타입을 지정하는 방법으로 가장 확실하고 정확한 방법입니다.

이때 name, age 그리고 hobby 중 하나라도 정확하지 않은 타입을 가지거나 빠져있다면 에러를 나타낼 것입니다.

 

두 번째 즉 per2의 경우 as 키워드를 사용하여 Person이라는 타입을 지정해 주었습니다.

이때 일부러 hobby의 값은 지정하지 않았습니다. 하지만 딱히 에러를 나타내지 않습니다.

이게 바로 as 키워드의 함정입니다. 타입 Person은 3가지의 값을 모두 가져야만 사용이 가능합니다.

하지만 as키워드를 사용한다면 그중 몇 개가 빠져도 별다른 에러를 보여주지 않는다는 것입니다.

이는 실제로 코드가 작동할 때 예상치 못한 에러를 발생시킬 수 있는 확률이 너무 높습니다.

 

마지막 per3의 경우 as 키워드 대신 satisfires라는 키워드를 사용하였습니다.

이 키워든 느 결과적으로 per1과 같이 꼭 필요한 값이 하나라도 빠져있다면 에러를 나타내게 됩니다.

 

 

2. 사용방법과 주의점.

as 키워드나 satisfies키워드나 사용 방법은 동일합니다. 값 뒤에 as 혹은 satisfies 키워드를 작성하신 후 필요한 타입을 작성하시면 됩니다. 하지만 가능하다면 per1과 같이 처음에 값을 지정해 주는 것이 가장 편한 방법일 것입니다.

주의점은 현재 사용하시는 모듈 즉 dependency가 satisfies라는 키워드를 지원하지 않는 버전일 수 있습니다.

이는 자연스럽게 시간이 지나 dependency들이 업데이트되면 자연스럽게 해결될 일이지만, 현재로서 아직 지원하지 않는 dependency가 있을 수 있습니다. 이러한 부분이 아니라면 기존 as 키워드를 사용할 때처럼 사용하시면 되고 오히려 as 보다 정확하고 안전한 방법입니다.

 

 

3. 마치며

개발의 공부는 끝이 없는 것 같습니다.

조금만 지나도 새로운 기능 새로운 방법들이 등장하니 말입니다.

하지만 이는 개발자라는 직업의 장점이 아닐까 싶습니다. 결과적으로 새로운 기능과 방법들이 사용자들에게 조금이나마 빠르고 편하고 유저친화적인 프로그램이나 애플리케이션을 제공하는 것이기 때문입니다.

요 근래 저와 정말 친한 누나도 새로 이직을 위해서 개발공부를 시작하였습니다.

제가 옆에서 가능한 한 많은 것을 도와주려고 하고 있지만,

저도 똑같이 경험한 바로 얼마나 힘들고 배울게 많은지 그리고 어려운지 알고 있습니다.

지금도 개발 공부를 시작하거나 하고 계신 분들이 많겠지만 모두 힘내셨으면 좋겠습니다.

파이팅입니다!