Estoy jugando con la creación de un juego de lucha en 2D. usando solo javascript, css y html, estoy atascado en cómo evitar que el botón de ataque sea enviado como un loco. Si presiono la tecla de ataque 5 veces por segundo, también se registra y también hace la animación. Quiero restringir el registro de claves a 1 vez por 750 milisegundos.
¿Cómo lograría esto? Creo que tiene algo que ver con el sello de tiempo, pero no puedo entender la lógica.
Esto es lo que tengo sin la restricción:
window.addEventListener('keydown', (event) =>{ switch (event.key) { case ' ': if (player_1.position.x < (player_2.position.x + 25)) {player_1.attack_player_1() // setTimeout(() => {sword_swing.play()},200)} setTimeout(() => {sfx_player_1.sword_swing.play()},200)} else {player_1.attack_player_1_reversed() setTimeout(() => {sfx_player_1.sword_swing.play()},200) } break } });Supongo que es posible que necesite un intervalo de tiempo para varias funciones y, para eso, debe realizar un seguimiento de cada intervalo de tiempo de función con una variable separada. En su lugar, he creado una clase para usarla como ayudante de ralentización. este es un ejemplo que puede editar en su código.
class slowDown { constructor(cb,timeGap){ this.last = 0 this.run = function(){ let current = Date.now(), shouldRun = (current - this.last) >= timeGap if(shouldRun){ cb(current - this.last) this.last = current } } } } // example use const press = new slowDown(timeElapsed => { // define function here which you wanted to slow down console.log("pressed after " + timeElapsed + " ms") },750) window.addEventListener("keydown",()=>{ press.run() })Es más profundo qué comportamiento esperas. si presionas fuego y sigues presionando, atacarás. Una solución sería limitar lo que @svarog ya dijo en los comentarios bajo su pregunta.
La otra solución sería bloquear después de que uno presione el botón todavía a) presione otro botón o b) establezca un tiempo de espera, por ejemplo, 1 segundo y el tiempo de espera expiró.
En cualquier caso, preferiría trabajar con e.keyCode en lugar de e.key .
ejemplo
document.onkeydown = check let lastKeyCode = ''; function check(e) { if (e.keyCode == 32) { if(lastKeyCode == 32) return false; // do something lastKeyCode = 32; } /// other events }