JSFiddle - React, Tailwind, and code Playground

HTML

<input type ="text" id="demoIp">

CSS

#btn_playPause {
    background-image: url(../contents/img/losAudio_play.png);
    height: 35px;
    width: auto;
}
.demoClass{
  
  background-color:red;
}

JavaScript

function Control () {
    this.w = 0;
    this.a = 0;
    this.s = 0;
    this.d = 0;
    document.getElementById('demoIp').addEventListener("keydown", this.KeyDown.bind(this))
    console.log("abc");
    document.getElementById('demoIp').addEventListener("keyup", this.KeyUp.bind(this));
    console.log(Control.prototype);
}
Control.prototype.KeyDown = function (event, control) {
   console.log('vvv')
    switch (event.keyCode) {
        case 87:
            this.w = 1;
            break;
        case 65:
            this.a = 1;
            break;
        case 83:
            this.s = 1;
            break;
        case 68:
            this.d = 1;
            break;
    }
    console.log("w: " + this.w + "\na: " + this.a + "\ns: " + this.s + "\nd: " + this.d);
}
Control.prototype.KeyUp = function (event) {
    switch (event.keyCode) {
        case 87:
            this.w = 0
            break;
        case 65:
            this.a = 0;
            break;
        case 83:
            this.s = 0;
            break;
        case 68:
            this.d = 0;
            break;
    }
    console.log("w: " + this.w + "\na: " + this.a + "\ns: " + this.s + "\nd: " + this.d);
}
var control = new Control ();