避免可能未定义的值

Question

在流程中我有很多可选参数，像这样：

type Props = {
   assets?: string[]
}

我只有在确定它们不是未定义时才访问它们，但是 Flow 不断警告“无法访问可能未定义的值的属性”。

但是我知道它是肯定定义的，因为我只在定义时调用此方法。比如这样：

类 MyComponent 扩展 React.Component { 过滤器资产（）{ 返回 this.props.assets.filter(....); } 使成为（） { 返回 this.props.assets ？过滤器资产（）：空 } }

看到我已经有一个 if 语句。有没有办法避免这个警告，而不添加真正的javascript逻辑来隐藏这个警告？

通过真正的 js 逻辑，我的意思是我想避免的方法：

filterAssets() { 如果（！this.props.assets）返回； // 添加这一行 返回 this.props.assets.filter(....); }

Answer 1

您必须在filterAssets 内进行优化。否则，该函数可能会不安全地从应用程序的其他位置调用。

class MyComponent extends React.Component { 
  props: {
    assets?: string[]
  }

  filterAssets() { 
    return this.props.assets 
      ? this.props.assets.filter(....) : null; 
  } 

  render() { 
    return this.filterAssets();
  } 
}

或者，您可以重构 filterAssets 以获取明确类型的 assets 属性：

class MyComponent extends React.Component { 
  props: {
    assets?: string[]
  }

  filterAssets(assets: string[]) { return assets.filter(....); } 

  render() { 
    const assets = this.props.assets;
    return assets ? this.filterAssets(assets) : null 
  } 
}