时间戳

首页 > 解决方案 > JS函数变量看不到全局变量

javascript - JS函数变量看不到全局变量

问题描述

let numFlag = document.getElementById("numBTN-Flag");
let callFlag = document.getElementById("callScreen");
let callDisplay = document.querySelector(".numberCalling");
let callingText = document.querySelector(".connectText");

function callCancel() {
  callFlag.style.display = "none";
  numFlag.style.display = "block";
  callDisplay.innerText = "";
  display.innerText = "";
}

const answerNumber = () => {
  numFlag.style.display = "none";
  callFlag.style.display = "block";
  let callDisplay = document.querySelector(".numberCalling");
  callDisplay = callDisplay.innerText += display.innerText;
  const callText = () => {
    if (callDisplay.length >= 9) {
      let callingText = document.querySelector(".connectText");
      callingText = callingText.innerText = "łączę...";
      setTimeout(function() {
        let callingText = document.querySelector(".connectText");

        callingText = callingText.innerText = "Trwa połączenie...";
        // do zrobienia odliczanie
      }, 4000);
    } else {
      let callDisplay = document.querySelector(".numberCalling");
      callDisplay.innerText = "Zły numer";
    }
  };
  callText();
};

在编写个人项目时，我遇到了一个小问题。这是一个小型手机模拟器，此时我面临“全球范围”问题的挑战。正如您在提供的代码中看到的，我在全局中有 4 个变量，但只有两个（numFlag和callFlag）可以正常工作。当涉及到callDisplay和callingText变量我每次需要时都必须调用它们，就像函数无法访问它们的全局版本一样。我尝试删除本地范围版本，并希望它可以在全局范围内运行，但它不会。我知道我现在可以这样（它应该像它那样工作）但是额外的变量只会使代码更难阅读和维护......而且它让我发疯，为什么它不起作用。所以请赐教：）

标签： javascriptfunctionvariablesscopeproject

解决方案

发生这种情况是因为以下几行

callDisplay = callDisplay.innerText += display.innerText;
callingText = callingText.innerText = "łączę...";
callingText = callingText.innerText = "Trwa połączenie...";

他们正在覆盖callDisplay和callingText变量。

利用

callDisplay.innerText += display.innerText;
callingText.innerText = "łączę...";
callingText.innerText = "Trwa połączenie...";

相反，它会按你的意愿工作

let numFlag = document.getElementById("numBTN-Flag");
let callFlag = document.getElementById("callScreen");
let callDisplay = document.querySelector(".numberCalling");
let callingText = document.querySelector(".connectText");

function callCancel() {
  callFlag.style.display = "none";
  numFlag.style.display = "block";
  callDisplay.innerText = "";
  display.innerText = "";
}

const answerNumber = () => {
  numFlag.style.display = "none";
  callFlag.style.display = "block";
  callDisplay.innerText += display.innerText;

  const callText = () => {
    if (callDisplay.innerText.length >= 9) {
      callingText.innerText = "łączę...";
      setTimeout(function() {
        callingText.innerText = "Trwa połączenie...";
        // do zrobienia odliczanie
      }, 4000);
    } else {
      callDisplay.innerText = "Zły numer";
    }
  };
  callText();
};

推荐阅读