时间戳

首页 > 解决方案 > Uncaught (in promise) ReferenceError: isBlack is not defined

javascript - Uncaught (in promise) ReferenceError: isBlack is not defined

问题描述

我使用以下代码从浏览器控制台中的标题中发现错误：

 jQuery(document).ready(function(){

  betterBlitzColor();

  let isBlack = true;
  function animate() {
    $(".playerInfoCoatTwo").animate({
      backgroundColor: isBlack ? "transparent" : 'black'
    }, 20);
    isBlack = !isBlack;
  }

  // Delay function,
  // allows for much flatter code when you can `await` a `Promise` compared to `setTimeout`:
  const delay = ms => new Promise(res => setTimeout(res, ms));
  async function animateAndWait(msArr) {
    for (let i = 0; i < msArr.length; i++) {
      // debugger;
      animate();
      await delay(msArr[i]);
    }
  }

  async function betterBlitzColor() {
    console.log(isBlack);
    await animateAndWait([20, 300, 50, 150, 50, 50]);
    if (myRandomNumberBetween(1, 100) <= 0) {
    console.log(isBlack);

      return delay(myRandomNumberBetween(9000, 18000))
        .then(betterBlitzColor);
    }
    await animateAndWait([650, 300]);
    if (myRandomNumberBetween(1, 100) <= 0) {
    console.log(isBlack);

      return delay(myRandomNumberBetween(9000, 18000))
        .then(betterBlitzColor);
    }
    await animateAndWait([400, 100, 100, 150]);
    console.log(isBlack);

    delay(myRandomNumberBetween(9000, 18000))
      .then(betterBlitzColor);
  }


  // console.log(myRandomNumberBetween(1, 5))
  function myRandomNumberBetween(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
  }
  }); // end of jQuery(document).ready(function()

如果我删除这些行：

 jQuery(document).ready(function(){
}); // end of jQuery(document).ready(function()

再次出现同样的错误。但如果我移动这条线：

}); // end of jQuery(document).ready(function()

我没有错误。我不知道发生了什么……有人帮忙。

在 HTML 中：

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.12.1/jquery-ui.min.js" integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU=" crossorigin="anonymous"></script>

<script src="js/typed.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/typed.js/1.1.1/typed.min.js"></script>  
<script src="js/javascript.js"></script>

我看到很多人在这里遇到同样的问题，但无法为我找到任何解决方案。

我在 isBlack 上将 let 转换为 var，然后出现错误：

Uncaught (in promise) ReferenceError: delay is not defined

然后改成这样：

var delay = ms => new Promise(res => setTimeout(res, ms));

我得到了错误：

Uncaught (in promise) TypeError: delay is not a function

标签： javascriptasync-await

解决方案

您应该在定义了它所依赖的所有内容betterBlitzColor 之后调用。把它放在变量声明之后，而不是之前。函数声明被提升，但任何其他分配都没有。另请注意，如果您使用的是现代版本的 jQuery，则可以使用$(function() {(或$(() => {而不是jQuery(document).ready(function(){, 以使脚本更易于阅读。例如：

$(() => {
  let isBlack = true;
  const delay = ms => new Promise(res => setTimeout(res, ms));
  betterBlitzColor();
  // ...

如果您真的愿意，您也可以更改delay为函数声明，这将导致它被提升并允许您betterBlitzColor在代码中的更高行上调用，但这会使代码有点难看 IMO：

$(() => {
  let isBlack = true;
  betterBlitzColor();
  function delay(ms) {
    return new Promise(res => setTimeout(res, ms));
  }
  // ...

推荐阅读