Ошибка JavaScript-функции

Question

Во-первых, я не свободно говорю с JavaScript. Я скремблировал эту функцию, чтобы вытащить некоторые статистические данные и применить их как строки html к соответствующим элементам с помощью JSON. Иногда это работает, а иногда и нет.

AFAIK, функция должна ждать 3 секунды, прежде чем что-либо делать, а затем повторить функцию снова и снова каждые 2 секунды (правильно?).

var userGameStats = setTimeout(function() { 
    $.getJSON('/id/stats', function (data) { 
     // Pull the stats 
     var userWinningBets = data.winningBets, 
     userLosingBets = data.losingBets, 
     userTotalBets = data.totalBets, 
     userStreak = data.streak, 
     userBestStreak = data.bestStreak; 

     // Apply stats to elements 
     $('#stats_won span').text(userWinningBets); 
     $('#stats_lost span').text(userLosingBets); 
     $('#stats_total span').text(userTotalBets); 
     $('#stats_ratio span').text((userTotalBets > 0) ? ((userWinningBets/userTotalBets) * 100).toFixed(1) + '%' : "0%"); 
     $('#stats_streakbest span').text(userBestStreak); 
     $('#stats_streak span').text(userStreak); 
    }); 

    userGameStats(); 
    setInterval(userGameStats, 2000); 
}, 3000); 

Я получаю эту ошибку (в консоли):

Uncaught TypeError: Property 'userGameStats' of object [object Object] is not a function 
(anonymous function) 

Как решить эту проблему? Есть ли лучший, более правильный способ форматирования синтаксиса?

Answer 1

В вашем случае userGameStats - это значение, возвращаемое setTimeout(), которое является ссылкой на созданный таймер (значение int), что является причиной ошибки.

Это должно быть

var userGameStats = function() { 
    $.getJSON('/id/stats', function (data) { 
     // Pull the stats 
     var userWinningBets = data.winningBets, 
      userLosingBets = data.losingBets, 
      userTotalBets = data.totalBets, 
      userStreak = data.streak, 
      userBestStreak = data.bestStreak; 

     // Apply stats to elements 
     $('#stats_won span').text(userWinningBets); 
     $('#stats_lost span').text(userLosingBets); 
     $('#stats_total span').text(userTotalBets); 
     $('#stats_ratio span').text((userTotalBets > 0) ? ((userWinningBets/userTotalBets) * 100).toFixed(1) + '%' : "0%"); 
     $('#stats_streakbest span').text(userBestStreak); 
     $('#stats_streak span').text(userStreak); 
    }); 
} 

setTimeout(function(){ 
    userGameStats(); 
    setInterval(userGameStats, 2000);// once started repeat every 2 seconds 
}, 3000); //first time wait for 3 seconds 

Answer 2

Вы можете присвоить имя функции внутри исходного SetTimeout. Затем вы можете обратиться к этой функции в новом setTimeout внутри функции.

setTimeout(function userGameStats() { 
    $.getJSON('/id/stats', function (data) { 
     // Pull the stats 
     var userWinningBets = data.winningBets, 
     userLosingBets = data.losingBets, 
     userTotalBets = data.totalBets, 
     userStreak = data.streak, 
     userBestStreak = data.bestStreak; 
     // Apply stats to elements 
     $('#stats_won span').text(userWinningBets); 
     $('#stats_lost span').text(userLosingBets); 
     $('#stats_total span').text(userTotalBets); 
     $('#stats_ratio span').text((userTotalBets > 0) ? ((userWinningBets/userTotalBets) * 100).toFixed(1) + '%' : "0%"); 
     $('#stats_streakbest span').text(userBestStreak); 
     $('#stats_streak span').text(userStreak); 
    }); 
    setTimeout(userGameStats , 2000); 
}, 3000);