JSFiddle - React, Tailwind, and code Playground

by Mike Hedman

HTML

<p><span id="mary_name"></span>'s phone: <span id="mary_phone"></span>
</p>
<p><span id="tom_name"></span>'s phone: <span id="tom_phone"></span>
</p>

JavaScript

function Person() {}
Person.prototype.name = '';
Person.prototype.phones = [];

Person.prototype.getName = function () {
    return this.name;
};
Person.prototype.setName = function (value) {
    this.name = value;
};

Person.prototype.getPhones = function () {
    return this.phones;
};
Person.prototype.addPhone = function (number) {
    this.phones.push(number);
};

var mary = new Person();
mary.setName('Mary');
mary.addPhone('123-456-7890');
$('#mary_name').html(mary.getName());
$('#mary_phone').html(mary.getPhones()[0]);

var tom = new Person();
$('#tom_name').html(tom.getName());
$('#tom_phone').html(tom.getPhones()[0]);