在阅读缩小的Javascript时，我该如何用逗号，&&和||读取这个return语句。运营商？

Question

我有这个源代码：

function findMessageErrors(btn) { 
    var error = ""; 
    var message = $(btn).parent().siblings().find("textarea[name='message']").val(); 
    if (message === "") { 
     error += "*Please enter a message.<br/>"; 
    } 
    if (!$(btn).parent().siblings().find('input[name="agree"]').prop('checked')) { 
     error += "*Please agree.<br/>"; 
    } 
    return error; 
} 

这被精缩。缩小后，它看起来像这样在Chrome开发工具源标签：

function findMessageErrors(btn) { 
    var error = ""; 
    return "" === $(btn).parent().siblings().find("textarea[name='message']").val() && (error += "*Please enter a message.<br/>"), 
    $(btn).parent().siblings().find('input[name="agree"]').prop("checked") || (error += "*Please agree.<br/>"), 
    error 
} 

我明白是怎么逗号运营商运行一系列表情，在顺序，然后返回他们最后的结果“(from here) 。但是我很难理解那些OR和AND操作符是如何在构建在缩小的代码中返回的字符串的工作。

有没有人有一个有用的方式，大声朗读，这将帮助我了解如何工作？我想我没有看到源代码中的2个独立IF语句如何被缩小为一系列的& &然后||。我不想在每次想了解缩小代码工作原理的逻辑时查找源代码。

Answer 1

如有可能，请使用source maps而不是尝试读取缩小的代码。

但这并不意味着你不想知道如何阅读复杂的语句;有时候人类会写它们。 :-)

我已经做了一些格式和嵌入式注释来解释：

function findMessageErrors(btn) { 
    var error = ""; 
    return (
     (
      "" === $(btn).parent().siblings().find("textarea[name='message']").val() 
      && 
      // This only runs if the === above is true, because of the && 
      (error += "*Please enter a message.<br/>") 
     ) 
     , 
     (// This runs regardless of the above 
      $(btn).parent().siblings().find('input[name="agree"]').prop("checked") 
      || 
      // This only runs if prop("checked") returned a falsy value, because of || 
      (error += "*Please agree.<br/>") 
     ) 
     , 
     (// This runs regardless, of the above... 
      // ...and this is the ultimate value of the return 
      error 
     ) 
    ); 
} 

外()只是因为添加后return触发器（恐怖即是）自动分号插入断行。其他()是为了解释清楚而添加的。