Typescript:可选字段和未定义的并集有什么区别?

(A) :

interface State {
  userDetails: undefined | string | DataStructure | Error;
}

(B) :

interface State {
  userDetails?: string | DataStructure | Error;
}

强制我将字段显式设置为未定义,如下所示:

static readonly initialAppState: AppState = {
  userDetails: undefined
};

但是有 (B)

static readonly initialAppState: AppState = { };

如果我在使用定义时尝试省略字段 (A) Typescript会抱怨说:

Property 'userDetails' is missing in type

(A) ? 在初始化时强制执行不同要求的两个定义之间有什么不同?

编辑 :如果您发现这个问题和下面的答案有趣或相关,您可能想知道TypeScript在v4.4中正在更改以添加 --exactOptionalPropertyTypes 旗帜这个新标志现在将导致一些原始代码出现错误,这促使我提出这个问题。