如何删除 TS2722：无法调用可能“未定义”的对象。错误？

我有一个看起来像这样的函数

let bcInst;
if(props.onBoundsChanged){
    bcInst = kakao.maps.event.addListener(map, 'bounds_changed',()=>{
        props.onBoundsChanged(map); //I get error here
    })
}

道具界面如下所示

interface IMapProps{
    mapId?: string;
    longitude: number;
    latitude: number;
    level:number;
    onBoundsChanged?:{
        (map:any) : void
    }
}

即使我在 if 语句中检查 props.onBoundsChanged，我也会收到 TS2722: Cannot invoke an object which might be 'undefined'。我使用 props.onBoundsChanged 的​​位置出错。我该如何解决这个问题？

TypeScript 正在说你的onBoundsChanged可能是未定义的，因为您已将其定义为可选(?)接口 IMapProps 中的属性：

onBoundsChanged?: {}

您的支票onBoundsChanged for a truthy值是正确的，但是稍后会调用事件监听器，这意味着onBoundsChanged可能像 @basarat 指定的那样未定义。您可以通过使用其中之一来避免此错误在你的听众里面。

调用前检查真值onBoundsChanged

if(props.onBoundsChanged) onBoundsChanged(map)

Use 可选链接 ?.操作员访问onBoundsChanged

props?.onBoundsChanged(map)

一些有用的学习资源：

您可以阅读更多有关truthy来自 MDN 的值（此处）。https://developer.mozilla.org/en-US/docs/Glossary/Truthy https://developer.mozilla.org/en-US/docs/Glossary/Truthy

更多关于optional chaining ?.运营商在这里。https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining