JSFiddle - React, Tailwind, and code Playground

by Brenton Strine

HTML

<div class="output"></div>
<div class="output2"></div>
<div class="output3"></div>
<div class="output4"></div>
<div class="output5"></div>
<div class="output6"></div>
<div class="output7"></div>
<div class="output8"></div>
<div class="output9"></div>
<div class="output10"></div>
<div class="output11"></div>
<div class="output12"></div>

JavaScript

function CarObjectConstructor( model, year, miles ) {
  // `this` is the car object being constructed.
   this.model = model;
  this.year = year;
  this.miles = miles;
}

CarObjectConstructor.prototype.toString = function () {
    return this.model + " has gone " + this.miles + " miles";
};

var civicCarObject = new CarObjectConstructor( "Honda Civic", 2009, 20000 );
var mondeoCarObject = new CarObjectConstructor( "Ford Mondeo", 2010, 5000 );

document.querySelector(".output").innerHTML = civicCarObject.toString();

civicCarObject.toString = function () {
    return this.model + " has gone " + this.miles + " miles. (this method is in the object)";
};
CarObjectConstructor.prototype.toString = function () {
    return this.model + " went " + this.miles + " miles (this method is in the constructor prototype)";
};

document.querySelector(".output2").innerHTML = civicCarObject.toString();

delete civicCarObject.toString;
document.querySelector(".output3").innerHTML = civicCarObject.toString();
 
//document.querySelector(".output4").innerHTML = civicCarObject.toString();