JSFiddle - React, Tailwind, and code Playground

HTML

<div id="output"></div>

JavaScript

var log = $('#output');

Function.prototype.inherits = function(parent, arguments) {
    if (typeof parent.constructor === 'function') {
        this.prototype = new parent(arguments);
        this.prototype.constructor = this;
        this.prototype._super = parent.prototype;
    }
    return this;
};

function Modal(props) {
    this.viewModel = {
        name: 'Modal'
    };
    
    if (props) {
        for (var prop in props) {
            this.viewModel[prop] = props[prop];
        }
    }
}

Modal.prototype = {
    activate: function(params) {
        log.append('<p>' + this.viewModel.name + ' activating</p>');
    },
    attached: function(view) {
        log.append('<p>' + this.viewModel.name + ' attached</p>');
    },
    deactivated: function() {
        log.append('<p>' + this.viewModel.name + ' deactivating</p>');
    },
    detached: function(view, parent) {
        log.append('<p>' + this.viewModel.name + ' detached</p>');
    }
};

var modal = new Modal();
modal.activate();
modal.attached();
modal.deactivated();
modal.detached();

function ChildModal() {
    this.viewModel.name = 'ChildModal';
}

ChildModal.inherits(Modal, { version: 'ChildModal v2.0' });

ChildModal.prototype.activate = function(params) {
    this._super.activate.call(this);
    log.append('<p>' + this.viewModel.version + ' activating [overridden]</p>');
};

var childModal = new ChildModal();
childModal.activate();
childModal.attached();
childModal.deactivated();
childModal.detached();