I consoled out the this keyword (pls refer the code) but for div the console out was different and for Input tag it's different. Wondering why?
(function(){
document.addEventListener('DOMContentLoaded', function(){
const complement = new Complement();
complement.generateRandomNumber();
complement.events();
});
class Complement{
constructor(){
this.firstInt = document.getElementById('firstint') //this is div
this.secondInt = document.getElementById('secondint') //this is input
this.sumInt = document.getElementById('sumint')
}
events = function(){
this.secondInt.addEventListener('keyup', this.checkFields)
}
}
Complement.prototype.generateRandomNumber = function(){
**console.log(this) //this refers to the Class Complement. why?**
let randonFirstInt = Math.floor(Math.random()*100)
//assign random number to first integer
this.firstInt.textContent = randonFirstInt;
}
Complement.prototype.checkFields = function() {
**console.log(this) //this refers to the input tag. why?**
let secondIntInput = this.value
console.log(secondIntInput)
}
})()
