Return 语句导致：预期一个赋值或 function 调用，而是看到一个表达式 no-unused-expressions

Question

我有时仍然很难理解何时或何时不使用return语句。 我最近在我的 ReactJS 代码中遇到了一个问题。 基本上我从 fetch 调用中得到 html 然后将其设置为元素的 innerHTML。 设置后我需要稍微更改该数据。

当它不起作用时：

  useEffect(()=>{
    setHeaderFooter(props.data.header,props.data.footer, changeLinks)
  }, [props.data.header,props.data.footer])

  const changeLinks = ()=>{
    $(document).find('nav.navbar a[href*="/oc"]').each(function (index, element) {
      var original = $(element).attr('href');
      var final = process.env.REACT_APP_PLATFORM_URL + original;
      $(element).attr('href', final);
  });
  
  // Adds the first letter of the users name as the icon in header.
      $('#firstLetter').text()
      $('#firstLetterLink').text().charAt(0).toUpperCase()
  }

export const setHeaderFooter=(head,foot, callback) =>{
    let header = document.querySelector('#header')
    let footer = document.querySelector('#footer')
    header.innerHTML = head, footer.innerHTML = foot
   return callback()
}

当它工作时（最后没有修改阶段）：

  useEffect(()=>{
    setHeaderFooter(props.data.header,props.data.footer)
  }, [props.data.header,props.data.footer])

  const changeLinks = ()=>{
    $(document).find('nav.navbar a[href*="/oc"]').each(function (index, element) {
      var original = $(element).attr('href');
      var final = process.env.REACT_APP_PLATFORM_URL + original;
      $(element).attr('href', final);
  });
  
  // Adds the first letter of the users name as the icon in header.
      $('#firstLetter').text()
      $('#firstLetterLink').text().charAt(0).toUpperCase()
  }

export const setHeaderFooter=(head,foot) =>{
    let header = document.querySelector('#header')
    let footer = document.querySelector('#footer')
    return header.innerHTML = head, footer.innerHTML = foot
}

有人可以解释一下这里发生了什么。 我想更好地理解 return 语句。

Answer 1

问题是在header和footer分配之间使用的逗号：

改变这个：

header.innerHTML = head, footer.innerHTML = foot
return callback()

对此：

header.innerHTML = head;
footer.innerHTML = foot;
return callback();

要解释这个问题，请参阅MDN 文档：

逗号运算符 (,) 计算其每个操作数（从左到右）并返回最后一个操作数的值

在您的情况下， footer.innerHTML = foot是最后一个操作数，将被返回，但由于您没有将返回的值分配给任何东西，所以它被浪费了，因此您得到了 lint 错误。 您可以在Disallow Unused Expressions (no-unused-expressions)中阅读有关 lint 错误的更多信息