TypeScript泛型中如何用void实现函数参数可选（无需传undefined）

当前代码中，props的类型已被正确推断为void，但只有传入undefined作为参数时才能正常调用openModal，想知道能不能不传入任何参数直接调用？

原代码如下：

const openModal = <T>(
  modal: (props:T) => void,
  props: {} extends Omit<T, "onClose"> ? void : Omit<T, "onClose">
) => {
  return;
};

const ModalOne = (props: {onClose: () => void}) => {
    return;
}

const ModalTwo = (props: {text: string, onClose: () => void}) => {
    return;
}

openModal(ModalOne) // 无法运行（期望2个参数，实际传入1个，缺少'props'参数）
openModal(ModalOne, {}) // 无法运行（类型'{}'无法赋值给类型'void'）
openModal(ModalOne, undefined) // 可正常运行
openModal(ModalTwo, {text: 'test'}) // 可正常运行

解决方案 #

只需要把props参数改成可选参数（添加?标记），就能实现省略参数调用的需求：

const openModal = <T>(
  modal: (props:T) => void,
  props?: {} extends Omit<T, "onClose"> ? void : Omit<T, "onClose"> // 此处添加?标记
) => {
  return;
};

修改后验证调用情况：

• openModal(ModalOne)：可以正常运行，可选参数允许省略，此时等价于传入undefined，符合void类型要求
• openModal(ModalOne, undefined)：依然正常运行，不影响原有逻辑
• openModal(ModalTwo, {text: 'test'})：正常运行，和之前的行为一致

原因说明 #

原来的props是必填参数，哪怕类型是void，TypeScript也要求必须传入对应的void类型值（也就是undefined）。改成可选参数后，当不需要传值时可以直接省略，TypeScript会自动将其视为undefined，刚好匹配void类型的约束，同时也不影响需要传props的场景（比如ModalTwo的调用）。

内容的提问来源于stack exchange，提问作者hackid