[TypeScript]타입스크립트 any, unknown 차이

TypeScript에는 다른 프로그래밍 언어에는 존재하지 않는 타입들이 존재합니다.

 

그중에서 any, unknown이 두 가지 타입은 제대로 이해하지 않으면, 상당히 헷갈리는 타입이며, 스택오버플로우에서도 자주 언급되는 타입입니다.

 

이번에 타입스크립트에서 사용되는 unknown, any 타입을 공부할 겸 블로그에 정리하였습니다.

 

목차

1. any
2. unknown
3. 정리

---

any

영어에서 한정사 any 단어의 뜻은 '어떤 것이든지, 누구든지'라는 해석을 가집니다.

 

TypeScript에서는 '어떤 타입이든'이라는 의미로 해석할 수 있습니다.

 

즉, TypeScript에서 any 타입은 어떠한 타입도 허용하는 타입인데요.

 

타입을 엄격하게 검사하고 처리하는 TypeScript에서 any 타입은 치명적인 존재입니다.

 

아래 코드는 변수 value를 number 타입으로 정의하고 value.length를 출력하는 간단한 코드입니다.

let value : number = 10;

console.log(value.length); // 문제 발생

 

number 타입은 length 프로퍼티가 존재하지 않기 때문에 TypeScript에서 문제가 발생했다고 개발자에게 전달합니다.

number 타입에서 length 프로퍼티 사용

개발자는 위 사진처럼 경고 또는 문제 되는 내용을 보고 사전에 문제 되는 코드에 대해 밸리데이션 체크 및 예외처리를 하여 문제를 방지할 수 있습니다.

 

하지만, number가 아닌 any 타입으로 선언하는 경우 문제가 발생하지 않습니다.

let value : any = 10;

console.log(typeof value); // number
console.log(value.length); // undefined

변수 value은 typeof 연산자를 사용하여 확인해보면, number 타입입니다.

 

number 타입은 length 프로퍼티가 존재하지 않지만, 변수 value가 any타입으로 정의되어 undefined가 출력되었습니다.

 

TypeScript는 any 타입에 대해 엄격하게 검사 또는 체크하지 않기 때문에 개발자의 입장에서는 문제가 없는 코드라고 판단할 수 있지만, 실제로 애플리케이션을 개발하거나 FrontEnd를 개발하면 any 타입 때문에 문제가 발생하는 경우가 종종 있습니다.

 

그렇기 때문에 개발자는 항상 any 타입을 조심해서 사용해야 합니다.

반응형

---

unknown

TypeScript 3.0에서 unknown 타입이 도입되었습니다.

 

unknown 타입은 단어의 뜻과 동일하게 '알 수 없다, 모른다'라는 의미를 가집니다.

 

unknown 타입은 any 타입과 동일하게 모든 값을 허용하지만, 할당된 값이 어떤 타입인지 모르기 때문에 함부로 프로퍼티나 연산을 할 수 없습니다.

 

아래 코드는 unknown 타입을 사용한 코드입니다.

let valueNum : unknown = 10;
let valueStr : unknown = 'Test';

console.log(valueNum.length); // 문제 발생
console.log(valueStr.length); // 문제 발생

위 코드를 작성하면, 다음 사진처럼 문제가 발생합니다.

unknown 타입이라 문제가 발생했다는 뜻입니다.

 

unknown 타입으로 변수를 정의하면 컴파일러에게 '변수의 타입이 unknown이라 어떤 값이든 올 수 있다. 그래서 엄격하게 검사해라'라고 요청하는 것과 동일합니다.

 

다음과 같이 조건문을 사용하여 타입 검사를 하는 경우에는 문제없이 동작합니다.

let valueNum: unknown = 10;
let valueStr: unknown = "unknown";

if (typeof valueNum === "number") {
  console.log(valueNum.length);
}

if (typeof valueStr === "string") {
  console.log(valueStr.length);
}

하지만, valueNum.length 코드에서 문제가 발생하는데요.

타입 검사는 정상적으로 되었지만,  valueNum이 number 타입이라서 length를 사용할 수 없다고 개발자에게 경고를 전달합니다.

 

체크를 해야 되는 코드는 많아지겠지만, 사전에 문제가 되는 부분을 방지할 수 있으므로 any 타입에 비해 안정적인 애플리케이션을 개발할 수 있습니다.

---

정리

any

• 모든 타입을 허용합니다.
• TypeScript에서 타입 검사를 느슨하게 하므로 개발 당시에는 문제가 없으나 애플리케이션 또는 웹 페이지 개발 후 예기치 못한 문제가 발생할 가능성이 매우 높습니다.

 

unknown

• 모든 타입을 허용합니다.
• any 타입과는 다르게 프로퍼티 또는 연산을 하는 경우 컴파일러가 체크합니다. 그러므로 문제 되는 코드를 미리 예방할 수 있습니다.