- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我很惊讶地发现 TypeScript 不会提示我做这样的事情:
type sth = { value: number, data: string } | { value: number, note: string };
const a: sth = { value: 7, data: 'test' };
const b: sth = { value: 7, note: 'hello' };
const c: sth = { value: 7, data: 'test', note: 'hello' };
我想也许 value
被选为类型联合判别式或其他东西,因为我唯一能想到的解释是 TypeScript 是否以某种方式理解 number
这里是 1 的超集 | 2
例如。
所以我在第二个对象上将 value
更改为 value2
:
type sth = { value: number, data: string } | { value2: number, note: string };
const a: sth = { value: 7, data: 'test' };
const b: sth = { value2: 7, note: 'hello' };
const c: sth = { value: 7, data: 'test', note: 'hello' };
仍然,没有提示,我能够构造 c
。尽管 IntelliSense 在 c
上出现故障,但当我在 .
中输入它时,它不会给出任何提示。如果我将 c
中的 value
更改为 value2
,则相同。
为什么这不会产生错误?显然,我没有提供一种或另一种类型,而是提供了两者的奇怪组合!
最佳答案
问题中的讨论 Microsoft/TypeScript#14094在这里是相关的。
TypeScript 中的类型是开放的,因为对象必须至少类型描述的属性才能匹配。所以对象 { value: 7, data: 'test', note: 'hello' }
匹配类型 { value: number, data: string }
,即使它有多余的 note
属性:
const obj = { value: 7, data: 'test', note: 'hello' };
const val: sthA = obj; // okay
所以你的 c
变量确实是一个有效的 sth
。只有当它缺少联合的某些组成部分所需的所有属性时,它才会成为某物
:
// error: missing both "data" and "note"
const oops: sth = { value: 7 };
但是:当您在 TypeScript 中将新的对象文字分配给类型化变量时,它会执行 excess property checking试图防止错误。这具有在该分配期间“关闭”TypeScript 的开放类型的效果。这与您对接口(interface)类型的预期一样有效。但对于联合,TypeScript 当前(如 this comment 中所述)仅提示未出现在任何 consituents 上的属性。所以下面仍然是一个错误:
// error, "random" is not expected:
const alsoOops: sth = { value: 7, data: 'test', note: 'hello', random: 123 };
但是 TypeScript 目前并没有按照您想要的严格方式对联合类型进行额外的属性检查,它会根据每个组成类型检查对象文字,如果所有这些类型中都有额外的属性,就会发出警告。它确实用 discriminated unions 做到了这一点,如 microsoft/TypeScript#12745 中所述,但这并没有解决您的问题,因为 sth
的定义都没有受到歧视(意思是:拥有一个属性,其文字类型恰好挑选出并集的一个组成部分)。
因此,除非更改,否则最好的解决方法可能是在使用对象字面量时避免并集,方法是显式分配给预期的组成部分,然后在需要时扩大到并集:
type sthA = { value: number, data: string };
type sthB = { value: number, note: string };
type sth = sthA | sthB;
const a: sthA = { value: 7, data: 'test' };
const widenedA: sth = a;
const b: sthB = { value: 7, note: 'hello' };
const widenedB: sth = b;
const c: sthA = { value: 7, data: 'test', note: 'hello' }; // error as expected
const widenedC: sth = c;
const cPrime: sthB = { value: 7, data: 'test', note: 'hello' }; // error as expected
const widenedCPrime: sth = cPrime;
如果您真的想要表达对象类型的排他性联合,您可以使用mapped和 conditional类型来做到这一点,通过将原始联合体变成一个新联合体,其中每个成员通过将它们添加为 never
类型的可选属性(显示为 undefined
因为可选属性总是undefined
):
type AllKeys<T> = T extends unknown ? keyof T : never;
type Id<T> = T extends infer U ? { [K in keyof U]: U[K] } : never;
type _ExclusifyUnion<T, K extends PropertyKey> =
T extends unknown ? Id<T & Partial<Record<Exclude<K, keyof T>, never>>> : never;
type ExclusifyUnion<T> = _ExclusifyUnion<T, AllKeys<T>>;
有了它,您可以将 sth
“排除”到:
type xsth = ExclusifyUnion<sth>;
/* type xsth = {
value: number;
data: string;
note?: undefined;
} | {
value: number;
note: string;
data?: undefined;
} */
现在会出现预期的错误:
const z: xsth = { value: 7, data: 'test', note: 'hello' }; // error!
/* Type '{ value: number; data: string; note: string; }' is not assignable to
type '{ value: number; data: string; note?: undefined; } |
{ value: number; note: string; data?: undefined; }' */
关于typescript - 为什么 A | B允许两者结合,我该如何防止呢?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65654839/
我有一个应用程序,其中许多对象都扩展了一个抽象类,该抽象类定义了诸如 create() edit() retrieve() 和 delete()。由于每个子类对这些函数使用相同的逻辑,抽象类定义了默认
我正在使用$anchorScroll滚动到页面顶部,其中 html 元素具有 ID #brand。 AngularJS 代码: $location.hash(
我想停用我的应用程序中的右键单击,该右键单击提供了在桌面上安装应用程序的选项。我该如何做这样的事情? 最佳答案 右键单击 Visual Studio 中的项目并选择属性。那里有一个复选框“启用浏览器运
我使用 jquery 定位 div,在我的 CSS 中我有一个 div.right-sm:hover{background-color: blue} 我想使用 jquery 停止悬停: $(this
所以,我正在尝试复制 html5“占位符”属性功能。 我目前坚持的一件事是,在获得元素焦点时,插入符号立即出现在输入的开头。 就目前情况而言,插入符号出现在用户单击的位置,然后当我使用 jQuery
当表单填写并发送时,如果您刷新页面,它表示表单将再次发送。 (再次提交表格)。 防止这种情况发生的好方法是什么?或者终止这个 session ? 这方面有什么指导吗? 谢谢 最佳答案 处理完POST信
我想阻止 @ 被输入到 input 中。但它不起作用,知道为什么吗? $(function() { $(document).on('keyup', '[placeholder="x"]', fun
我正在使用 PHP 创建一个应用程序并涉及 MySQL。如果在请求过程中发生错误,我将如何“将查询分组在一起”,检查它是否会成功,然后对真实表进行实际影响。如果对表的实际更新失败,则恢复到更新之前的状
这个问题在这里已经有了答案: 关闭 11 年前。 Possible Duplicate: Best Java obfuscator ? 对于我的示例,我知道 eclipse 提供了一个反编译插件。而
这是一个演示我的问题的 fiddle :JSFiddle 我正在制作自定义下拉菜单(实际上我使用的是 icomoon 图标而不是 V)...它看起来不错,但是父元素的 ::after 是阻止选择:(
每当我编写需要大量条件的代码时,我都会这样做: if foo: if bar: if foobar: if barfoo: if foobarfoo:
我不确定术语是否正确,您可以使用哪些代码实践来使某人难以修改二进制文件/程序集以绕过检查: 例如在源代码中。 bool verificationResult = verify(); if (verif
我正在寻找一种简单的方法来检查多个零件表,以确定给定零件号在添加到给定表之前是否已经存在。 我目前想到的最好的想法是一个辅助表,它简单地将所有表中的每个 PN 列在一个列中,并带有一个唯一的键;但是我
这个问题在这里已经有了答案: jquery stop child triggering parent event (7 个答案) 关闭 8 年前。 我不确定这是否真的冒泡,我会解释。 我有这个:
我有一个 Spring MVC web 应用程序(不确定该信息是否重要,但它可能是)使用 ModelAndView 将字符串值传递给 JSP 文件。 字符串值的形式是: d@.
我在这里尝试使用表单 key 方法进行 csrf 保护 http://net.tutsplus.com/tutorials/php/secure-your-forms-with-form-keys/
htmlentities 是防止 PHP 中的 XSS 的最佳解决方案吗?我还想允许像 b、i、a 和 img 这样的简单标签。实现这一点的最佳解决方案是什么?我确实考虑过 bbcode,但发现如果没
我有一个非常基本的 JAX-RS 服务(下面的 BookService 类),它允许创建 Book 类型的实体(也在下面)。 POST负载 { "acquisitionDate": 14188
我正在使用 Polymer 1.5,我确实需要“this”变量不要映射到外部。我知道 typescript 会为某些人做这件事 valid reasons . declare var Polymer:
这个问题在这里已经有了答案: Class-level read-only properties in Python (3 个答案) 关闭 6 年前。 有没有一种方法可以通过重写实例变量的 __set
我是一名优秀的程序员,十分优秀!