JavaScript Inheritance Example

Creating a JavaScript object utilizing inheritance

A simple method for JavaScript inheritance is describe below.  The referenced code is available at here at my github page.

There is more than one way to complete this programming pattern.  I use the following when writing my own JavaScript code.

You first create your base object. in this example it is called page.  You then create your child object.  In this example it is called mainPage.

Code Example

The page object

function page() {

this.ajax = function() {                            

return new Ajax();                            


this.doAjax = function(ajax) {                            


url : ajax.url,                            

data :,                            

success: ajax.success                           




type : “POST”,                           

dataType : ‘json’                           


return this;                           


The mainPage object

function mainPage() {        

this.getMessage = this.ajax();                                                        

this.saveData = this.ajax();                                                        

this.getMessage.url = ’/ajaxData.php’;                     = 1;                            

this.getMessage.success = function(data) {                             get.obj(mainPage) = data;                             console.log(data);                             };     

 this.saveData.success = function(data) {                             alert(data.message);                           


this.setupModal = function() {                            

$(’#launchModal’).click(function() {                           




$(’#myModal’).on('’, function(event) {                           

 var button = $(event.relatedTarget) // Button that triggered the                             // modal                            

var recipient ='whatever’) // Extract info from data-*                             // attributes                            

var modal = $(this)                            





 return this;                          


Extend the mainPage object

mainPage.prototype = new page();                           mainPage.prototype.constructor = mainPage;


A full working example is in my github page.  Here is the link.