未捕获(承诺)ReferenceError:未定义isBlack

时间:2018-10-03 06:04:38

标签: javascript async-await

我用以下代码提示浏览器控制台标题中的错误:

 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上使用var,然后出现错误:

Uncaught (in promise) ReferenceError: delay is not defined

然后更改为:

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

我得到了错误:

  

未捕获(承诺)TypeError:延迟不是函数

1 个答案:

答案 0 :(得分:2)

您应该在定义了它依赖的所有内容之后调用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));
  }
  // ...