SYSK 285: Is JavaScript an Object Oriented Programming Language?


First, let’s agree on a definition of object oriented programming. 


 


It is generally agreed that “software objects” share two characteristics: they all have state and behavior (similar to real-life objects).  Behavior is implemented through methods (a.k.a. functions) and the state is stored in fields (a.k.a. class members).


In addition, an OOP language must support the following three major features: encapsulation, inheritance and polymorphism.


 


So, let’s see if JavaScript fits the OOP definition…


 


1.    First, let’s implement a “class” Pet (see note below) private member variables (i.e. information hiding) and properties  demonstrating encapsulation in JavaScript


 


Note: JavaScript doesn’t use classes as C# or VB.NET.  It is sometimes called a ‘class-free’ language as it uses functions to implement the concept of classes, constructors, and methods. 


 


function Pet(name, color)


{


    // Variables declared in constructor become private members


    var _name = name;


    var _color = color;


       


    // Public methods


    this.getName = function() { return _name; }


    this.setName = function(name) { _name = name; }


    this.getColor = function() { return _color; }      


    this.setColor = function(color) { _color = color }


}


 


// Public instance member


Pet.prototype.getFamily = "unknown";


 


 


To create this class:


 


var pet = new Pet("Spot", "white-and-black");


 


or


 


var pet = new Pet();


pet.setName("Spot");


pet.setColor("white-and-black");


 


 


To call methods:


 


alert("My pet's name is " + pet.getName() + " and he is " + pet.getColor() + ".  Family = " + pet.getFamily + ".");


 


 


2.    Now, let’s implement inheritance and extend the base type by adding ‘bark’ method:


 


function Dog(name, color)


{


    Pet.call(this, name, color);


}


 


Dog.prototype = new Pet();


Pet.prototype.getFamily = "canine";


 


Dog.prototype.bark = function()


{


    alert('Woof-woof');


}


 


 


var pet = new Dog("Spot", "white-and-black");


alert("My pet's name is " + pet.getName() + " and he is " +


     pet.getColor() + ".  Family = " + pet.getFamily + ".");


pet.bark();


 


 


3.    Next, let’s implement aggregation (has-a) support…


 


Simply defined, aggregation or containment, in object-oriented terms, means the ability to store objects entirely inside other objects.


 


function Address(street, city)


{


    var _street = street;


    var _city = city;


       


    this.getStreet = function() { return _street; }


    this.setStreet = function(street) { _street = street; }


    this.getCity = function() { return _city; }


    this.setCity = function(city) { _city = city; }


}


 


function Pet(name, color)


{


    // Variables declared in constructor become private members


    var _name = name;


    var _color = color;


   


    var _livesAt = new Address();


       


    // Public methods


    this.getName = function() { return _name; }


    this.setName = function(name) { _name = name; }


    this.getColor = function() { return _color; }      


    this.setColor = function(color) { _color = color; }


   


    this.setAddress = function(street, city)


    {


        _livesAt.setStreet(street);


        _livesAt.setCity(city);


    }


   


    Pet.prototype.Address = _livesAt;


}


 


 


var pet = new Dog("Spot", "white-and-black");


pet.setAddress("123 Main Street", "Wonderland");


 


alert("My dog " + pet.getName() + " lives at " + pet.Address.getStreet() + " in " + pet.Address.getCity() + " city");


 


 


4.     How would you implement polymorphism?  Let’s introduce the Cat and method ‘speak’ (notice that Dog and Cat use slightly different ways to override the Pet.speak method):


 


function Address(street, city)


{


    var _street = street;


    var _city = city;


       


    this.getStreet = function() { return _street; }


    this.setStreet = function(street) { _street = street; }


    this.getCity = function() { return _city; }


    this.setCity = function(city) { _city = city; }


}


 


function Pet(name, color)


{


    // Variables declared in constructor become private members


    var _name = name;


    var _color = color;


   


    var _livesAt = new Address();


       


    // Public methods


    this.getName = function() { return _name; }


    this.setName = function(name) { _name = name; }


    this.getColor = function() { return _color; }      


    this.setColor = function(color) { _color = color; }


   


    this.setAddress = function(street, city)


    {


        _livesAt.setStreet(street);


        _livesAt.setCity(city);


    }


   


    this.Address = _livesAt;


   


    Pet.prototype.speak = function() { throw "Method 'speak' must be implemented by derived classes"; }


}


 


 


// Public instance member


Pet.prototype.getFamily = "unknown";


 


 


function Dog(name, color)


{


    Pet.call(this, name, color);


}


 


Dog.prototype = new Pet();


Dog.prototype.getFamily = "canine";


 


Dog.prototype.speak = function()


{


    alert('Woof-woof');


}


 


// Cat type


function Cat(name, color)


{  


    Pet.call(this, name, color);


   


    this.speak = function()


    {


        alert('Meeeoooow');


    }


}


 


Cat.prototype = new Pet();


Cat.prototype.getFamily = "feline";


 


 


 


To call:


var pet1 = new Dog("Spot", "white-and-black");


var pet2 = new Cat("Felix", "white");


 


pet1.speak();


pet2.speak();


 


 


 


What’s the bottom line?  JavaScript is a loosely typed (as opposed to strongly typed C#) language that does appear to have support for OOP concepts, and thus, arguably, it is an object oriented programming language.

Comments (4)

  1. Srikanth Bhakthan says:

    Excellent Post!

  2. Tom says:

    Thanks for the article.  

    Can someone explain why Microsoft chose Javascript as their language of choice for Microsoft Gadgets rathter than usingone of their own languages, like VBscript or a .NET language?

    Thank you,

    Tom

  3. irenake says:

    Because JavaScript is supported by all modern browsers, where as VBScript and JScript are not…  

  4. Dan says:

    In bullet #2, isn’t this line Pet.prototype.getFamily = "canine";

    supposed to be Dog.prototype.getFamily = "canine";

    ?

Skip to main content