javascript - ES2016 默认参数为空数组会导致 "no-empty-pattern"警告

Question

我正在构建一个 React 应用程序，我已使用 Create React App 作为构建环境。在我的一个(基于类的)组件中，我的 componentDidUpdate() 方法中有以下行:

const toast = ([] = this.props.toast.toast);

如果我的理解是正确的，这是 ES2016 语法，用于在变量未定义时设置默认值。 (如果这不正确，请告诉我，尽管这不是这个问题的重点)。

当我的 React 应用程序渲染时，我在控制台中收到以下警告:意外的空数组模式 no-empty-pattern。

我知道 ESLint “提示”它是一个空数组。但是因为在这种情况下我想要一个空数组，为什么这会导致警告？

我可以简单地告诉 ESLint 忽略它(使用 //eslint-disable-line no-empty-pattern)吗？

Answer 1

这根本不是你认为它在做的事情。它没有为空数组设置任何内容，也不是默认变量的语法。它所做的是滥用数组解构语法而没有任何好处。自己尝试一下:如果执行此代码，toast 的值将是未定义的:

const toast = ([] = undefined);

据我所知，除了默认的函数参数之外，没有 ES6 语法用于默认变量，这与您使用的完全不同。如果您想要默认变量值，只需使用经过验证的短路方法:

const toast = this.props.toast.toast || [];

详细来说，正确的数组解构的工作原理如下(假设 this.props.toast.toast 是一个数组):

const [first, second, third] = this.props.toast.toast;
first === this.props.toast.toast[0]; // true
second === this.props.toast.toast[1]; // true
third === this.props.toast.toast[2]; // true