javascript - 使用 javascript 闭包时未捕获 TypeError : X is not a function.

Question

我正在使用 JavaScript，并在控制台中看到以下错误:

Uncaught TypeError: div is not a function.

function getRandomColor() {
    var letters = '0123456789ABCDEF';
    var color = '#';
    for (var i = 0; i < 6; i++) {
        color += letters[Math.floor(Math.random() * 16)];
    }
    return color;
}

function createDiv(interval) {
    let radius = 300;
    let int = interval;
    var f = 0;
    var s = 2 * Math.PI / 180;
    let timerId = window.setTimeout(function tick()
    {
        var div = document.createElement('div');
        div.className = 'circle';
        div.style.backgroundColor = getRandomColor();
        div.style.left = (radius + radius * Math.cos(f)) + 'px';
        div.style.top = (radius + radius * Math.sin(f)) + 'px';
        document.body.appendChild(div);
        f += s;
        setTimeout(tick, int);
    }, int)

}

let div = createDiv(10);
div(); 

为了简单起见，我留下了以下内容:

function createDiv(interval) {
    let timerId = window.setTimeout(function tick()
    {
        setTimeout(tick, 10);
    }, 10)
}

let div = createDiv(10);
div();

这本质上是一个无限循环。调用 div() 但循环正常时发生错误。

出了什么问题？又是如何解决的？

Answer 1

这里没有闭包:您正在调用一个返回undefined的函数，并尝试调用undefined()，就好像它是一个函数一样。只需调用您的函数，例如 createDiv(10);。请注意，我已向您的 div 添加了高度和宽度，以便结果可见。

function getRandomColor() {
  var letters = '0123456789ABCDEF';
  var color = '#';
  for (var i = 0; i < 6; i++) {
    color += letters[Math.floor(Math.random() * 16)];
  }
  return color;
}

function createDiv(interval) {
  let radius = 300;
  let int = interval;
  var f = 0;
  var s = 2 * Math.PI / 180;
  let timerId = window.setTimeout(function tick() {
    var div = document.createElement('div');
    div.className = 'circle';
    div.style.backgroundColor = getRandomColor();
    div.style.height = div.style.width = "50px";
    document.body.appendChild(div);
    f += s;
    setTimeout(tick, int);
  }, int)
}

createDiv(1000);