Question

我正在尝试理解此代码段中的第三行（条件表达式条件中的赋值value = f）是如何工作的：

someProp(propName, f) {
  let prop = this._props && this._props[propName], value
  if (prop != null && (value = f ? f(prop) : prop)) return value
  ...
}

在此示例中，value语句未定义console.log(value)：

let f = 42;
value = f ? console.log('true') : console.log('false');
console.log(value);

在我看来，第一个代码段第三行返回的value变量将始终未定义。我错过了什么？该片段来自我正在研究的开源项目中的生产代码。

此外，this._props是一个对象。为什么作者使用if (prop != null && ...来测试props对象是否存在，而不仅仅是if (prop && ...之类的东西？我是否正确地认为这是更有经验的开发人员的典型代码，或者其他人会以不同的方式编写它？

Answer 1

条件运算符的赋值运算符为higher precedence，因此会对其进行解析

if (prop != null && (value = (f ? f(prop) : prop))) return value
//                           ^                  ^

不

if (prop != null && ((value = f) ? f(prop) : prop)) return value
//                   ^         ^

正如你所期待的那样。所以，是的，在您的演示示例中，您始终获得undefined，因为这是console.log调用的返回值。但是，此处会为其分配f(prop)或prop。

另外，为什么作者使用的是prop != null && ...而不只是prop && ...？

因为他喜欢明白。

我是否正确地认为这是更有经验的开发人员的典型代码？

没有。可能是典型的开发人员代码，曾经被虚假的价值所困扰。

Answer 2

让我们来看看这一行：

if (prop != null && (value = f ? f(prop) : prop)) return value

特别是这部分：

(value = f ? f(prop) : prop)

如果f真实，请将value设置为f(prop)的返回值。

如果f不是真的，请将value设置为prop的值。

然后检查值是否为thruthyness并返回。

在你的第二个例子中：

let f = 42;
value = f ? console.log('true') : console.log('false');
console.log(value);

您实际所做的是将value设置为console.log('true')的返回值，该值始终为undefined，因为console.log()返回undefined。

我是否正确地认为这是更有经验的开发人员的典型代码，或者其他人会以不同的方式编写它？

为了更容易理解，特别是如果在教程中使用代码，我会亲自扩展代码以提高学习者的可读性，但我也喜欢我的代码紧凑，所以如果它是库的代码，我会＆＃39; d也可能沿着这些线编码。

Answer 3

我个人认为写得不好;除了经验，它太难读了。在一个if条件中的三元组合，然后可以返回一个任务 - 冷静下来。

这是简单的：

if ( prop != null ) {
    if ( f ) {
        value = f( prop );
    } else {
        value = prop;
    }
    if ( value ) return value;
}

额外的怪癖是如果它是假的，value将不会被返回，（我猜）这就是为什么它的赋值是if条件的一部分。作者很聪明地将所有这些逻辑塞进一行，但在我看来，它最好是愚蠢的。

在代码片段中了解条件运算符和赋值条件

3 个答案: