반응형
📝declare function
declare function alert(message?: any): void;외부에 함수가 있는 경우(내가 코드를 수정할 수 없음)는 타입을 지정할 수 없다.
이럴 경우 declare function을 이용해 해당 타입은 이거야 라고 알려줄 수 있다.
📝declare module
타입이 없는 외부 JS 라이브러리 보완하기
declare module "some-lib" {
export function greet(name: string): string;
export const version: string;
}Typescript를 기본적으로 사용하는 JS의 경우 TS가 없으면 사용할 수 없습니다. 이러한 경우를 해결하기 위해 declare module을 사용하면 됩니다. 이렇게만 선언해도 TypeScript는 에러 없이 import 할 수 있습니다.
하지만 그 안에 타입을 정의하지 않으면 그 모듈의 모든 export는 전부 any 타입으로 간주됩니다.
기존 라이브러리 타입 확장
// types/express/index.d.ts
import "express"; // ✅ express 타입 정의를 불러와서 확장 준비 (기존 보강의 경우에서만 사용)
declare module "express-serve-static-core" {
interface Request {
user?: { id: string; name: string };
}
}
// 사용
import express from "express";
const app = express();
app.use((req, res, next) => {
req.user = { id: "123", name: "Alice" }; // ✅ 타입 에러 없음
next();
});이미 타입이 존재하는 라이브러리라도 타입이 불완전하거나 내가 커스텀 기능을 추가해서 쓰고 싶은 경우가 있습니다. 이때는 기존 모듈을 보강할 수 있습니다.
참고로 일반적으로는 declare 파일명은 .d.ts 라는 확장자를 붙여서 만듭니다.
📝객체 기반으로 타입 추출하기 (enum to type)
const couponDiscountType = {
RATE: { code: 1, name: "정률" },
AMOUNT: { code: 2, name: "정액" },
} as const;
type CouponDiscountType = typeof couponDiscountType[keyof typeof couponDiscountType];
// 결과
// type CouponDiscountType =
// | { readonly code: 1; readonly name: "정률" }
// | { readonly code: 2; readonly name: "정액" };
반응형
