Tag Archives: object

OOP in JavaScript

In this post, I discuss some basic concepts about OOP (Object Oriented Programming) in JavaScript, including how to create objects and classes, how to set properties and methods for a class to be private and public, how to do inheritance, etc.

For more details on the OOP, you can refer to this post: http://www.ibm.com/developerworks/cn/web/1304_zengyz_jsoo/.

1. How to create objects directly?

In general, there are two ways to create an object in JavaScript. Below are two examples.


var obj = {
  property1: value1,
  property2: value2,
  method1: function() {
     return this.property1;
  },
  method2: function(value) {
    this.property2 = value;
  }
};

var obj = new Object();
obj.property1 = value1;
obj.property2 = value2;
obj.method1 = function() {
  return this.property1;
};
obj.method2 = function(value) {
  return this.property2 = value;
};

2. How to create classes?


function Person(name, age) {
  this.name = name;
  this.age = age;
  this.sayName = function(){
     console.log("I am "+this.name);
  };
}
obj me = new Person("Jincheng", 23);
me.sayName();

3. How to add methods for a class?


function Person(name, age) {
  this.name = name;
  this.age = age;
  this.sayName = function(){
     console.log("I am "+this.name);
  };
}
obj me = new Person("Jincheng", 23);
me.sayName();
//Add method makeFriends to class Person
Person.prototype.makeFriends = function(friendName) {
  console.log(this.name+" make friends with "+friendName);
};
me.makeFriends("Jane");

Tips: For each class, there is a corresponding prototype. If we want to add a method to an already-defined class, then we use the prototype of this class, just like what I show in the above example. After adding a method to the class, all objects of this class will automatically have this method.

4. How to set properties and methods to be private and public?

In default, the properties and methods of a class is public, then we can access the properties and methods outside the class. If we want some properties and methods to be private, we need to define the properties as variables and methods as functions as if this class doesn’t exist. Below is an example.

function Person(name, age, sex) {
  this.name = name; //defaultly, it is public
  var age = age;//the property "age" is private
  this.method1 = function() { //public function
    console.log("method1");
  };
  var method2 = function() {//private function
    console.log("method2");
  };
}
var me = new Person("Jane");
console.log(me.name);
console.log(me.age);//it's wrong, since the property age is private
me.method1();
me.method2();//it's wrong, since the method method2 is private

5. How to do inheritance?


function Animal(name, numLegs) {
  this.name = name;
  this.numLegs = numLegs;
  this.bark = function() {
    console.log("I am barking");
  };
}
function Penguin(name) {
  this.name = name;
  this.numLegs = 2;
}
//class Animal becomes the father of Penguin
Penguin.prototype = new Animal();
var penguin = new Penguin("jack");
penguin.bark();//class Penguin inherits method bark from its father