- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我想得到一个像这样的 Narrowing 类型:
type Expected = {
method: 'firstNamespace/firstMethod'
payload: [string]
} | {
method: 'firstNamespace/secondMethod'
payload: [number, number]
} | {
method: 'secondNamespace/firstMethod'
payload: [number]
}
从这样的方法的对象:
const Methods = {
firstNamespace: {
firstMethod: (p: string) => {},
secondMethod: (p: number, k: number) => {}
},
secondNamespace: {
firstMethod: (p: number) => {}
}
}
我尝试了各种方法,但我认为我在 TypeScript 中有一些误解。
最佳答案
这可以通过 recursive conditional types 在 TypeScript 中实现深入了解 Methods
的嵌套属性, 和 template literal types在类型级别将方法名称连接在一起。
我们将您要查找的类型函数称为 MethodsToExpected<T>
,它采用对象类型 T
并产生 union对象类型的 method
属性是 "/"
- 每个方法名称的分隔路径,其payload
属性是 tuple对应方法的参数类型。然后我们可以定义MethodsToExpected<T>
就自身而言,递归地是这样的:
type MethodsToExpected<T> = { [K in keyof T]-?:
T[K] extends (...args: infer P) => any ? { method: K, payload: P } :
MethodsToExpected<T[K]> extends infer X ? (
X extends { method: infer M, payload: infer P } ? (
{ method: `${Extract<K, string>}/${Extract<M, string>}`; payload: P }
) : never
) : never
}[keyof T]
施工
{[K in keyof T]-?: XXX}[keyof T]
,立即
indexes into一个
mapped type用它的键,产生所有
XXX
的联合类型。
K
来自
T
,我们检查属性类型
T[K]
.如果它是一个函数类型,那么我们获取它的参数列表并立即返回
{method: K, payload: P}
.否则我们申请
MethodsToExpected<T[K]>
到属性(property)并进行检查。
MethodsToExpected<T[K]>
“复制”到新的类型参数
X
中,然后我将其用作
distributive conditional type 中的检查类型,以便
X
中的任何联合都分发到最终的联合。如果您只是使用
MethodsToExpected<T[K]> extends {method: infer M, payload: infer P}
而不是中间
X
,它将产生类似
{method: "a/b" | "a/c", payload: [string] | [number]}
而不是所需的
{method: "a/b", payload: [string]} | {method: "a/c", payload: [number]}
的东西。)
MethodsToExpected<T[K]>
的每个联合元素,我们拔出
method
类型
M
和
payload
类型
P
, 并建立一个新的
method
/
payload
一对。
payload
类型不会改变,只是
P
, 但我们在当前 key
K
前面加上和斜线
"/"
到
M
使用模板文字类型。编译器不能确定
K
和
M
都是
string
类型,所以它不想让你写
`${K}/${M}`
直接地。相反,我们使用
the Extract<T, U>
utility type让编译器相信我们只会连接
string
s。
type Expected = MethodsToExpected<typeof Methods>;
/* type Expected = {
method: "firstNamespace/firstMethod";
payload: [p: string];
} | {
method: "firstNamespace/secondMethod";
payload: [p: number, k: number];
} | {
method: "secondNamespace/firstMethod";
payload: [p: number];
} */
看起来不错。为了确保它深入到嵌套的子属性,让我们尝试一个不同的:
type Nested = MethodsToExpected<{ a: { b: { c: { d: { e: (f: string) => number } } } } }>;
/* type Nested = {
method: "a/b/c/d/e";
payload: [f: string];
} */
也很好。
关于javascript - 从方法对象获取窄类型,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/69562731/
我想在DIV中做竖线 然后我想在垂直线上对 img 进行分层。(图片是我想要的结果) 我的源代码是这样的。 如何对这些元素进行分层??? 最佳答案 您需要做一些数学运算才能在中心调整它。 .ou
出于各种原因,我正在创建一个网站(尚未在线),该网站具有单独的移动页面。我想向“监控”站点添加一些内容,上面写着“如果浏览器宽度小于 X 像素,请查看 *mobilepagename.html 而不是
当尝试使用 jstat 监视 JVM 的性能时,我看到以下几行 - Timestamp PC PU OC **OU** YGC
html Lorem Ipsum... CSS #outer { background: url('mypic.jpg') no-repeat center top; } #i
我正在使用 sun-codemodel 生成代码。我对泛型有疑问。我知道要生成类似的东西 LinkedList, 我需要用 JType jtype = jCodeModel.ref("LinkedLi
考虑一个简单的系统,其中 PS(处理器系统)启用了 AXI3 主设备,连接到 AXI4 互连,该 AXI4 互连连接到可以访问 BRAM 内存的 BRAM Controller 。 AXI 窄突发的含
我在 Windows 上有一个狭窄的 Python 2.7.6 版本。我还有一个包含“窄”( 0xFFFF) Unicode 代码点的字符串。 >>> wide1 = u'\U0002b740' >>
我有一个函数可以验证 JSON 响应以确保它对应于给定的形状。 这是我定义所有可能的 JSON 值的类型——取自 https://github.com/microsoft/TypeScript/iss
我是一名优秀的程序员,十分优秀!