Question

我很困惑为什么会这样。基本上，我试图做一个单词/短语猜谜游戏，并且如果正确的按钮字母与短语中的字母匹配，它将发现该字母。我需要将匹配的（正确的）字母存储在变量中并返回该字母。如果猜出的字母不正确，则需要该函数返回null。

function checkLetter(clickedLetter) {
let letterFound = ""
if (clickedLetter.tagName == "BUTTON"){
    clickedLetter.className = "chosen";
    clickedLetter.setAttribute("disabled", "true");
    const li = document.querySelectorAll("li.letter")
    for (let i = 0 ; i < li.length ; i++){
        if (clickedLetter.textContent.toLowerCase() == li[i].textContent.toLowerCase()){
            li[i].classList = "show";
            letterFound = li[i]
           //without this return statement, it runs fine
            return letterFound
        } else {
        //without this return statement, it runs fine
        return null
        }
    }
}
}

qwerty.addEventListener("click", (e) => {
    const clickedLetter = e.target;
    checkLetter(clickedLetter);
});

https://jsfiddle.net/y4q7ot68/1/ 这是一个jfiddle演示，其中的return语句已被注释掉，可以正常工作。如果您取消注释return语句，它将变得很怪异，并且不会发现任何字母和/或所有字母。我在做什么错了？

Answer 1

它表现古怪的原因是它处于for循环中，并且会多次返回，并在第一次返回后结束该函数。为了保持返回功能，请在for循环中删除return并创建一个var，并从一开始就将其设置为true，然后将其设置为false，然后在for循环之外的if语句中进行比较，然后可以使用return语句。

function checkLetter(clickedLetter) {
  let letterFound = ""
  if (clickedLetter.tagName == "BUTTON") {
    clickedLetter.className = "chosen";
    clickedLetter.setAttribute("disabled", "true");
    const li = document.querySelectorAll("li.letter")
    var boolFound = false;
    for (let i = 0; i < li.length; i++) {
      if (clickedLetter.textContent.toLowerCase() == li[i].textContent.toLowerCase()) {
        li[i].classList = "show";
        letterFound = li[i];
        boolFound = true;
      } else {
        /* No return */
      }
    }
    if (boolFound == true) {
      return letterFound;
    } else {
      return null;
    }

  }
}

在调用此函数的地方，请不要忘记：

randomvar=checkLetter(clickedLetter);

添加return语句会使我的函数混乱，而忽略该return语句，该函数将正常运行？

1 个答案: