与扩展语法相关的奇怪语法答案

【问题标题】：Weird syntax related to spread syntax与扩展语法相关的奇怪语法
【发布时间】：2019-11-25 07:10:27
【问题描述】：

最近我遇到了这段代码，它在我更新 babel 依赖项之前运行良好。

const somefunc = ({ type }) => [
  ...type === 'image' && ['height'],
  'name',
  'text'
];

为了让它再次工作，我将代码更改为：-

const somefunc = ({ type }) => [
  type === 'image' && 'height',
  'name',
  'text'
];

现在的问题是我们的代码中很多地方都使用了旧语法。此外，我无法在社区或旧版 ES 或 babel 转译器中的任何地方找到此语法。

【问题讨论】：

..type === 'image' && ['height'], 应该表示“如果type 等于'image' 则展开数组['height']”。然而，这似乎不是一个好的选择，因为如果 type 不等于 'image，那么你会得到一个错误，因为表达式解析为 ...false 而你不能传播布尔值。所以，一方面，看起来 Babel 要么没有正确处理它，要么没有正确配置，但另一方面，你想要使用的语法可能会导致问题。

【解决方案1】：

正如 cmets 中所述，这是一种有条件地将项目添加到数组的方法，但是如果条件为 false，则此代码将不起作用。这可以通过使用三元运算符来解决：

const somefunc = ({ type }) => [
  ...type === 'image' ? ['height'] : [],
  'name',
  'text'
];

另外，您的第二个选项也无法正常工作，因为它会将false 添加到数组中，以防条件为false。

【讨论】：