JSFiddle - React, Tailwind, and code Playground

HTML

<button id="button">Serialize</button>
<br/>
<div>S2:</div>
<div><pre id="s2"></pre></div>
<hr/>
<div>serialize:</div>
<div><pre id="serialize"></pre></div>

JavaScript

function Animal( species, population ) 
{
   this.species = species;
   this.population = population;
}

Animal.prototype.getDetail = function() 
{
   return "Species: "+this.species+" Population: "+this.population;
}

function Mammal( species, population, bodyTemperature )
{
    Animal.apply(this, [species, population]);
    this.bodyTemperature = bodyTemperature;
}
Mammal.prototype= new Animal();
Mammal.prototype.constructor = Mammal;
Mammal.prototype.s2 = function() {
    return {
            species: this.species,
            population: this.population,
            bodyTemperature: this.bodyTemperature
    };
};

var Serialise= {
    init: function() {
        Mammal.prototype.serialise = this.serialiseMammal;
    },

    serialiseMammal: function() {
       return {
            species: this.species,
            population: this.population,
            bodyTemperature: this.bodyTemperature
       };
    }   
}

Serialise.init();

var bob = new Mammal("Human", 7000000000, 36.6);
$("#button").click(function(){
    $("#s2").html(JSON.stringify(bob.s2()));
    $("#serialize").html(JSON.stringify(bob.serialise()));
});