Создание спрайта внутри setInterval

Question

Используя функцию setInterval, я пытаюсь создавать спрайт раз в секунду на code.org , используя javascript, поэтому моя первая версия кода выглядит как

setInterval( function() {
  createSprite(200,200,20,20)
}, 1000)

Моя проблема в том, что размещение setInterval внутри функции Draw приводит к тому, что она не работает должным образом, и спрайт создается каждый тик после одной секунды, и когда setInterval не помещается в функцию Draw он не рисует спрайт, как я тоже.

Одно из решений, которое я пробовал, - это поместить функцию Draw внутри setInterval, но она не распознается и выдает сообщение об ошибке "Draw is defined, but it is not called in your program" .

Есть ли другая версия setInterval, которая работает внутри функции Draw, способ успешно поместить Draw внутри setInterval, способ заставить спрайт отображаться, даже если он Draw или другой способ решить эту проблему?

В частности, я ищу создание спрайта раз в секунду, чтобы он отображался на экране, возможность выбирать разные скорости для каждого зр rite каждый раз, когда создается новый, и возможность поместить эту функцию внутри функции if, и при этом она будет работать должным образом.

фрагмент кода, показывающий что-то, что частично работает, показан здесь:

https://studio.code.org/projects/gamelab/ApXezLpMzV3TfEfHx1CrhFyuteYDSKWe_6Hx0NdJgnc

Это работает в том отношении, что он порождает спрайт каждую секунду, но если я попытаюсь назначить скорость одного из созданных спрайтов, это будет только работает для первого, как показано здесь:

https://studio.code.org/projects/gamelab/ApXezLpMzV3TfEfHx1CrhFyuteYDSKWe_6Hx0NdJgnc

единственный способ, которым, я думаю, может быть принято решение, - это объявить класс, а затем создание спрайта этого класса внутри функции setInterval, но я точно не знаю, как это сделать.

Answer 1

Итак, я думаю, ваша проблема в том, что спрайт генерируется только через секунду, верно?

Если да, попробуйте следующее:

createSprite(200,200,20,20);
setInterval( function(){ createSprite(200,200,20,20)},1000);

Answer 2

См. Комментарии:

// just a helper function to generate random velocities
function random_in_range(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min }

var monster = createSprite(200,200,20,20);
monster.velocityX = 5;

setInterval(function() {
  // as you needed to set velocity for a newly created sprite
  // you need to have this sprite as a variable
  var fireball = createSprite(monster.x,monster.y,4,4);
  // now you can set it's velocity
  fireball.velocityX = random_in_range(1,6);
  // basically that's it.
  // as you don't do anything else with a "fireball"
  // you can just forget about it, and you don't need to save it anywhere
}, 1000);

function draw() {
  background("white");
  createEdgeSprites();
  monster.bounceOff(edges);
  drawSprites();
}

Ссылка с рабочим кодом

Глядя на ваш исходный код и на ваш вопрос, я думаю, что у вас могут быть некоторые c неправильные представления о JS (извините, если я ошибся). Объяснил их в комментариях к вашему коду. Я также добавил несколько строк, чтобы проиллюстрировать свои соображения:

var spawner = createSprite(200,200,20,20);
var remember_spawner = spawner // ADDED
// After a new sprite created it does't change 'spawner' variable
createSprite(150,200,15,15).velocityY = 3; // ADDED
console.log(remember_spawner === spawner) // ADDED // you see it's the same

// you need to assign the newly created sprite to a variable
// you can think of this as:
// I need give them different names so that they can understand to whom am I taking to
// and if you don't name them they won't listen to you at all
var spawner2 = createSprite(100,200,10,10);  // ADDED
spawner2.velocityY = 1  // ADDED // now you cat change velocity of another sprite
console.log(spawner !== spawner2) // ADDED // and it is another sprite

// var thing_to_be_spawned = createSprite(spawner.x,spawner.y,4,4);
  // You probably don't need this. And you don't use the variable anyway.
  // This sprite created at the same time as the spawner.
  // But if you need it, and you want it to move - change it's velocity (thing_to_be_spawned.velocityX = something) not the velocity of spawner
  // And it would be better if you'll name the function passed to setInterval
  // and call it instead of repeating it. Like so:
  // function fire() { ... } // define the function
  // fire() // call the function
  // setInterval(fire, 1000) // call the function every second

setInterval(function(){
  console.log("This function executed every second") // ADDED
  console.log("Fire!") // ADDED
  createSprite(spawner.x,spawner.y,4,4);
  console.log("Done") // ADDED
},1000);

console.log("Next line executed only once") // ADDED
spawner.velocityX=5;
// The fact that it's placed after setInterval() does mean that
// it will be executed after call to setInterval()
// but it doesn't mean that it will be executed after the function passed to setInterval(). Let's call it fire(), shall we?
// Actually, the fire() function will be called only after all the code in this file
// And setInterval() is also called only once, only the fire() passed to it called every second

function draw() { // Here you don't call draw() you only define it, so that code.org can call it whenever it wants
  // looking at the code draw function we can't tell when or how often it's called
  // it depends on the implementation details of code.org.
  // We can add console.log to find out
  console.log("Draw called") // ADDED
  background("white");
  createEdgeSprites();
  spawner.bounceOff(edges);
  drawSprites();
}
console.log("'fire()' not called yet") // ADDED

Журналы консоли можно увидеть в Debug Console из studio.code.org . Он открывается щелчком по Команды отладки . Используй это! То есть console.log(). Я мог бы также сказать «используйте команды отладки!» но отладка плохо реализована в studio.code.org и может вводить в заблуждение ... Вы обязательно должны попробовать, но ваше доверие вы должны вложить в console.log().