JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>user class</title>
</head>
<body>
<div id = "text" >
</div>
</body>
</html>
JavaScript
addEvent = function () {
this.userEventFirst = function () {};
this.userEventTwo = function () {};
this.attachEvent = function (event, handler) {
switch ( event ) {
case 'eventFirst': this.userEventFirst = handler; break;
case 'eventTwo': this.userEventTwo = handler; break;
}
};
this.working = function () {
this.userEventFirst();
//... hard work
var div = document.getElementById('text');
div.innerHTML += 'class working<br>';
this.userEventTwo();
}
};
// programmer use my class:
addEvent1 = new addEvent();
addEvent1.attachEvent('eventFirst', function() {
var div = document.getElementById('text');
div.innerHTML += 'user event First<br>' ;
});
addEvent1.attachEvent('eventTwo', function() {
var div = document.getElementById('text');
div.innerHTML += 'user event Two<br>' ;
});
addEvent1.working();