'Detect combination of user input using JavaScript

I'm trying to make an alert popup when I press a sequence of keys on my website, for example if I write "420" on my keyboard I want a message to popup saying "You made it" or something. I get it when I use only 2 keypresses using this:

  if (e.ctrlKey && e.keyCode == 90) {
    alert("Sweet");
  }
});

Which is the CTRL-key + letter Z, but I cant seem to understand how to make it work if I want it to be the correct sequence of 4 2 0 or something similar. And I'm only allowed to use JavaScript.



Solution 1:[1]

Simultaneous keys (like ctrl+Z) is different to a sequence (like 420).

One of many strategies could be to split the sequence into an array and use a copy of it (temp) to shift that sequence when the first element is typed.

let targetSequence = "420".split("")
let temp = [...targetSequence]

document.querySelector("#test").addEventListener("keyup", function(e) {

  if (temp[0] == e.key) {
    temp.shift()
  } else {
    temp = [...targetSequence]
  }
  console.log(temp)

  // If the sequence was done
  if (!temp.length) {
    console.log("--- You did it! ---")
    temp = [...targetSequence]
  }

})
<input id="test">

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Louys Patrice Bessette