Uncaught TypeError: X не является функцией.При использовании закрытия JavaScript - PullRequest
0 голосов
/ 21 ноября 2018

Я играю с JavaScript и вижу следующую ошибку в консоли:

Uncaught TypeError: 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.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(), но цикл работает.

Что не так?И как это исправить?

Ответы [ 2 ]

0 голосов
/ 21 ноября 2018

Здесь нет замыкания: вы вызываете функцию, которая возвращает 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);
0 голосов
/ 21 ноября 2018

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;
    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);
console.log(div);
try {
  div();
} catch (err) {
  console.log('error')
}


function createDivSmall(interval) {
   window.setTimeout(function tick()
    {
        setTimeout(tick, interval);
    }, 10)
}

let divSmall = createDivSmall(10);
console.log(divSmall);
try {
  divSmall();
} catch (err) {
  console.log('Small error')
}

В вашей функции createDiv вы ничего не возвращаете, поэтому поведение по умолчанию - возврат undefined.Это устанавливает div = undefined.На данный момент div не является функцией, поэтому попытка вызвать ее приведет к ошибке.createDiv запускает цикл для вас и запускает его, нет необходимости устанавливать переменную в возвращаемое значение.

...