javascript - typescript : cannot read property 'long_name' of null

Question

我尝试使用非空断言运算符，如TypeScript official documentation.所示下面是我的代码:

    let streetNumberComponent  = this.getAddressComponent(addressComponents, 'street_number');
    address.streetNumber = streetNumberComponent!.long_name();

    ...

    public getAddressComponent(addressComponents: Array<any>, type: string): any {

        addressComponents.filter( component => {
            let types : Array<string> = component.types;
            if(_.includes(types, type)) {
                return component;
            }
        });

        return null;
    }

我预计仅当 streetNumberComponent 不为 null 时才会访问属性 long_name()。但事实并非如此，我得到:

TypeError: Cannot read property 'long_name' of null

请注意，以下代码可以正常工作:

address.streetNumber = streetNumberComponent && streetNumberComponent.long_name();

<小时/>

我正在使用:

• TypeScript:2.0.10
• Angular :2.3.1
• Angular CLI:1.0.0-beta.24

Answer 1

非空断言运算符仅在 typescript 中使用，它不会在编译过程中保留下来，并且不会出现在 js 代码中。如文档中所述:

the ! non-null assertion operator is simply removed in the emitted JavaScript code

该运算符并不真正检查它之前的内容是否不为空，它只是告诉编译器您确定它不为空的一种方式，即使编译器本身无法推断出这一点.

显然，当您运行此代码时，streetNumberComponent 为 null。