[TS] : any unknown union

any < unknown < union

개인적으로 TS 가 JS 와 가장 큰 차별점을 두고 있는 부분이라 함은, 데이터의 형식을 "명시"할 수 있는 부분이라고 생각한다.

데이터의 타입이 "런타임"에 결정되는 JS와 달리 TS는 컴파일 과정에서 타입이 정해지기 때문에, 보통은 TS에서 각 데이터의 타입을 명시적으로 지정해 주지만,

어쩔 수 없이 가변적인 타입의 데이터를 저장하고 싶다면 any를 쓰기보다는 unknown을 사용는것이 좋은 것 같다.
그리고, 가변적인 타입을 일일이 정의할 수 있다면 union 을 사용하는 것이 제일 좋은 방안이라는 생각이 든다.

물론 개인적인 생각이다.

 

any

TS 에서 any 타입은 모든 타입의 슈퍼 타입이라고 생각하면 된다.

어떤 타입의 값이든 저장할 수 있다는 의미를 갖고 있기 때문이다.

JS 의 object 타입과 같은 최상위 타입이라고 생각하면 편하다.

 

any 사용 사례

let anything: any;
anything = 5;
anything = 'Hello';
anything = { id: 1, name: 'John' };

anything 이라는 식별자의 타입은 any로 명시해주었다.

따라서 재할당을 통해 숫자 / 문자 / object의 모든 형태가 정상적으로 담아지는 것을 볼 수 있다.

 

TS 에서 any 를 사용함에 대하여

우리가 TS 를 사용하는 주된 이유와 목적중의 하나는 프로그램의 타입 안정성을 확보하기 위한 것이다.

그런데, any 타입은 그 목적성에서 조금 벗어난 느낌이 든다.

any 타입은 코드의 안정성과 유지 보수성을 저해할 수 있다고 합니다.

 

unknown

any의 대체제

unknown 타입은 any 타입과 비슷한 역할을 하지만 더 안전한 방식으로 동작한다.

unknown 타입의 변수에도 any와 같이 모든 타입의 값을 저장할 수 있어요.

하지만, 그 값을 다른 타입의 변수에 할당하기 위해선 명시적으로 타입을 확인해야만 한다.

 

unknown 사용 사례

식별자의 타입을 unknown으로 지정해주고, 할당하는 값을 문자열로 할당했다.

let unknownValue: unknown = '나는 문자열';
console.log(unknownValue); // 나는 문자열

let stringValue: string;
stringValue = unknownValue; // 에러 발생! unknownValue가 string임이 보장이 안됨
stringValue = unknownValue as string;
console.log(stringValue); // 나는 문자열

문자열로 지정한 식별자와 위에 문자열을 할당한 식별자에 등호연산자를 통해 문자열을 담고있는 unknown 데이터를 할당한다면,
error가 발생이 된다.

다만, unknown을 alias로 문자열이라고 명시적으로 표현해준다면, 정상적으로 할당이 되고, console.log에도 출력값이 정상적으로 할당한 문자열 값이 나오는것을 확인 할 수 있다.

그래서 unkwown 타입의 변수를 다른 곳에서 사용하려면 타입 단언을 통해 타입 보장을 하여 사용할 수 있다.

위의 alias를 통한 명시적 표현이 타입 단언 이다.

 

또 다른 방법으로는 typeof 를 사용하는 방법이 있다.

let unknownValue: unknown = '나는 문자열';
let stringValue: string;

if (typeof unknownValue === 'string') {
  stringValue = unknownValue;
  console.log('unknownValue는 문자열');
} else {
  console.log('unknownValue는 문자열이 아니다');
}

typeof 키워드를 이용해서 미리 타입을 체크한 후,
unknown 타입의 변수를 string 타입의 변수에 할당할 수 있다.

 

unknown 의 한계

unknown 타입이 그나마 재할당을 할 때 타입 체크가 되어서 안전함을 보장할 수 있다.

다만, unknown 타입도 결국 재할당이 일어나지 않으면 타입 안전성이 보장이 되지 않는 다는 특징이 존재한다.

 

union

이럴 때를 위해 union 타입이라는 것이 사용됩니다.

union 은 여러 타입 중 하나를 가질 수 있는 변수를 선언할 때 사용이 된다.

union은 < | > 연산자를 사용하여 여러 타입을 결합하여 표현할 수가 있다.

 

union 사용 사례

type StringOrNumber = string | number; // 원한다면 | boolean 이런식으로 타입 추가가 가능하다.

function processValue(value: StringOrNumber) {
  if (typeof value === 'string') {
    // value는 여기서 string 타입으로 간주
    console.log('String value:', value);
  } else if (typeof value === 'number') {
    // value는 여기서 number 타입으로 간주
    console.log('Number value:', value);
  }
}

processValue('Hello');
processValue(42);

• TypeScript를 쓰면서 여러 타입을 하나의 변수로 해결하겠다는 생각은 가급적 지양하는 것이 좋다.
• 이런 사소한 습관들이 코드의 안정성을 높이고 유지 보수성을 개선할 수 있다는 생각이 든다.

 

 

#ts #union #any #unknown #