개발 공부

TypeScript에서 'any'와 'unknown' 타입 사용하기: 최선의 방법은? 본문

웹개발 (자바, 스프링, React)/Next.js

TypeScript에서 'any'와 'unknown' 타입 사용하기: 최선의 방법은?

아이셩짱셩 2024. 11. 13. 10:57

안녕하세요, 오늘은 TypeScript에서 자주 마주치는 'any'와 'unknown' 타입에 대해 이야기해보려고 합니다. ESLint 규칙을 따르다 보면 'any' 사용을 피하라는 경고를 자주 보게 되는데요, 그렇다고 모든 'any'를 'unknown'으로 바꾸는 게 정답일까요? 함께 알아봅시다!

ESLint 규칙이란?

먼저, ESLint 규칙에 대해 간단히 설명드리겠습니다. ESLint 규칙은 우리가 작성하는 코드의 품질을 일정 수준 이상으로 유지하기 위한 가이드라인이라고 볼 수 있습니다. 코드 스타일부터 잠재적인 버그까지, 다양한 측면에서 코드를 검사하죠.

'any'를 모두 'unknown'으로 바꿔야 할까?

'any' 타입은 TypeScript의 타입 체크를 완전히 무시하게 만듭니다. 그래서 ESLint에서는 'any' 사용을 경고하는 경우가 많죠. 그렇다고 해서 모든 'any'를 무조건 'unknown'으로 바꾸는 것이 최선은 아닙니다.'unknown'은 'any'보다는 안전하지만, 여전히 명확한 타입은 아니에요. 가능한 한 구체적인 타입을 사용하는 것이 가장 좋습니다. 'unknown'은 정말로 타입을 알 수 없을 때만 사용하세요.

타입을 지정하지 않은 경우는?

TypeScript를 사용한다면, 가능한 한 모든 변수와 함수에 타입을 지정해주는 것이 좋습니다. 하지만 모든 것을 'unknown'으로 채우는 것은 바람직하지 않아요. 대신, 다음과 같은 방법을 추천합니다:

  1. 가능한 한 구체적인 타입을 사용하세요. (예: string, number, boolean 등)
  2. 복잡한 객체의 경우, 인터페이스나 타입 별칭을 정의해 사용하세요.
  3. 타입 추론을 활용하세요. TypeScript는 꽤 똑똑해서 많은 경우 알맞은 타입을 추론해줍니다.

실전 예시

// 좋은 예: 구체적인 타입 사용
const username: string = "코딩하는 사람";

// 좋은 예: 타입 추론 활용
const age = 25; // 자동으로 number로 추론됩니다

// 좋은 예: 복잡한 타입은 인터페이스 사용
interface User {
  id: number;
  name: string;
  email: string;
}

const user: User = {
  id: 1,
  name: "코딩하는 사람",
  email: "coder@example.com"
};

// 'unknown' 사용이 적절한 경우
function processData(data: unknown) {
  if (typeof data === "string") {
    console.log(data.toUpperCase());
  } else if (typeof data === "number") {
    console.log(data.toFixed(2));
  }
}

마치며

TypeScript를 사용할 때는 'any'의 사용을 최소화하고, 가능한 한 구체적인 타입을 사용하는 것이 좋습니다. 'unknown'은 'any'보다는 안전하지만, 여전히 명확한 타입은 아니에요. 타입을 정말 알 수 없는 경우에만 'unknown'을 사용하고, 대부분의 경우에는 구체적인 타입을 지정해주세요. 이렇게 하면 코드의 안정성과 가독성이 크게 향상될 거예요!여러분의 TypeScript 코딩 생활에 이 글이 도움이 되었길 바랍니다. 다음에 또 다른 흥미로운 주제로 찾아뵙겠습니다! 😊

Comments