`exactOptionalPropertyTypes`: 없음과 `undefined` 구분하기

"{ a?: string }은 a가 없을 수 있다는 뜻이지, a에 undefined를 직접 넣어도 된다는 뜻은 아니야."

무엇이 달라지는가

설정을 끄면 { a?: string }은 빈 객체와 { a: undefined }를 모두 받아. 켜면 빈 객체만 받고, 명시적 undefined도 허용하려면 { a?: string | undefined }라고 써야 해.

이 차이는 JSON 직렬화와 프로퍼티 병합에서 중요해. Object.assign은 { a: undefined }를 ‘그대로 두기’가 아니라 ‘undefined로 설정하기’로 처리해.

마이그레이션 비용

기존 코드에서 undefined를 ‘값 없음’으로 써 온 자리가 모두 드러나. 해결은 보통 세 가지야.

프로퍼티를 아예 생략해.
타입에 명시적 undefined를 포함해.
나머지 코드에서도 부재와 undefined를 같은 것으로 취급하지 않게 고쳐.

이 설정은 ‘없음’과 ‘있지만 undefined’를 같은 것으로 볼지 결정하게 해. 둘이 다른 경계에서 생기는 버그를 정확히 겨냥해.

Code

exactOptionalPropertyTypes 없이와 함께·typescript

interface Config {
  host?: string;
}

// exactOptionalPropertyTypes 없이:
const a: Config = {};                     // ✅
const b: Config = { host: undefined };     // ✅ 받음

// Flag 와 함께:
const c: Config = {};                     // ✅
const d: Config = { host: undefined };     // ❌ — host omit 되거나 string 이어야

// 둘 다 허용하려면 명시 선언:
interface Config2 {
  host?: string | undefined;
}
const e: Config2 = { host: undefined };    // ✅

Exercise

작은 코드베이스에서 exactOptionalPropertyTypes를 켜고 오류 수를 세어. 각 자리에서 프로퍼티를 생략할지, 타입에 명시적 undefined를 허용할지 결정하고 어느 경우가 더 흔한지 기록해.

Hint

대부분의 프로젝트에는 두 경우가 섞여 있어. 과거에 undefined로 ‘값 없음’을 표현했다면 키 생략이 더 정확한지 먼저 확인해.

무엇이 달라지는가

마이그레이션 비용

Code

External links

Exercise

Progress

댓글 0