Question

我正在使用react / redux示例项目，并且由于我是Java的新手，因此我接触某些速记ES6 JavaScript的机会有限。我遇到以下麻烦的陈述是这样的：

function mapStateToProps(state) {
  const { selectedSubreddit, postsBySubreddit } = state;

  // This part here is confusing to me
  const { isFetching, lastUpdated, items: posts } = postsBySubreddit[
    selectedSubreddit
  ] || {
    isFetching: true,
    items: []
  };

  return {
    selectedSubreddit,
    posts,
    isFetching,
    lastUpdated
  };
}

我大体上了解此功能的目的，但是我不确定对此发表评论的那一部分是什么。

到目前为止，我收集到的是postsBySubreddit是一个数组，我们正在基于selectedSubreddit从中获取元素。从该元素中，我们正在“提取” isFetching，lastUpdated和items（同时将其别名为posts）。让我失望的是||运算符以及花括号中紧随其后的语句。

这是OR条件吗？如果是，我们是说如果postsBySubreddit [selectedSubreddit] ===未定义，我们将给isFetching值为true并为一个空数组提供项目吗？

Answer 1

您的理解几乎是正确的。在使用||运算符之前，您是正确的。但是对于||运算符，

如果postsBySubreddit [selectedSubreddit] === 未定义，我们给出的是isFetching值为true且项目为空数组

如果undefined虚假，例如postsBySubreddit[selectedSubreddit]，0，''，false，null，undefined。请注意，NaN和[]是真实的。（要轻松检查是否已忘记，可以在开发控制台或节点解释器中输入{}。

!!NaN等效于：

let a = b || c

类似地，let a; if (b) a = b; else a = c;等于

let a = b || {x: 0, y: 1}

Answer 2

||运算符意味着如果前一条为假，则运行下一条语句。

看看这个：

if (thing == "ok" || otherthing == "notok") {

我认为您知道这意味着什么。如果任一语句为true，请输入块。它“运行”的方式是先检查左语句（thing == "ok"），如果为假，然后运行下一条语句（otherthing == "notok"）。

相同的事情可以分配给变量：

var result = thing == "ok" || otherthing == "notok";

按照与我上面解释的相同的逻辑，如果left或right语句返回true，那么结果将为true。

现在，如果我们按照这种逻辑走得更远，我们可以这样做：

var result = FIRST_STATEMENT || SECOND_STATEMENT;

这将运行FIRST_STATEMENT，获取值并检查是否不是false。如果结果不为假，将运行SECOND_STATEMENT并返回值。如果FIRST_STATEMENT不是false，则会返回该值（因为不会运行SECOND_STATEMENT）。

简而言之，||运算符将从左到右评估语句，并返回不是false的第一个语句。

PD：请注意，null，undefined，""，NaN和0与false语句相同。

PD2：为明确起见，这些值中的任何一个都将彼此等于三倍（===）。

无法理解此javascript破坏结构声明

2 个答案: