JSFiddle - React, Tailwind, and code Playground

by SilentDepth

JavaScript

class Somebody {
	constructor () {
  	this.el = document.createElement('p')
    this.el.innerHTML = '<strong></strong> is <span></span>'
    document.body.appendChild(this.el)
  }
  
  set (prop, value) {
  	this.prop = value
    this['set$' + prop](value)
  }
  
  set$name (name) {
  	this.el.querySelector('strong').textContent = name
  }
  
  set$age (age) {
  	this.el.querySelector('span').textContent = age
  }
}

class Someone extends Somebody {
	set$age (age) {
  	this.el.querySelector('span').textContent = `${age} years old`
  }
}

const somebody = new Somebody()
somebody.set('name', 'Tom')
somebody.set('age', 14)

const someone = new Someone()
someone.set('name', 'Mike')
someone.set('age', 13)