OOPS with JS - Part 2

in the first part i covered few points about encapsulation and creating constructor methods. now it's time to dig more.

for novices: in JavaScript we can create the objects with new operator and with object literal .

//with new operator

var myObject = new Object()// creates an empty object;

var myEmployee = new Employee() // creates an Employee object;

//with object literal notation

var myObject = {} // creates an empty object;

var myEmployee = {name:"srinivas"} //created object with name property.

we will use . operator to access the properties and methods on an object.

alert(myEmployee.name) //srinivas

now it's time to create a base class / parent class.(as usual we need to create a function nothing more else).

function Parent(){

this.whoAmI = "parent";

}

we created a function called Parent. remember JavaScript functions are objects. also remember objects may have properties and methods. so our Patent function also an object (don't be scared just imagine every thing is an object). Parent function is having some methods and properties. let's check some important properties and methods.

Properties

1. constructor
2. arguments // deprecated
3. arity
4. length
5. name

Methods

1. apply
2. call
3. toString

some more browser, JavaScript engine specific functions also available. but above are most important. i will discuss each of them when ever they required. apart form these, there is one  more rule of thumb : in JavaScript every object have a property called prototype. that holds an object.

//createing a object

var myParent = new Parent();

//whoAmI is called as object's own property

alert(myparent.whoAmI)//parent

//our parent function also an object so we will have a prototype property for this.

alert(typeof(Parent.prototype))//object

OOPS with JS - Part 1

JavaScript doesn't have any class structure. but you can use constructor functions as classes.creating a constructor function is simple (just like creating a normal function). and you can have public members, private members, static members, privileged members(it is a way to access private members of your constructor).

//simple constructor function

function Employee(){
//private property

var name = "default Employee";
//private function

function setDefaultSalary(){
return 5000;
}
//public property

this.defaultCommision = 300;
//privilaged method

this.displayEmployeeInfo = function(){

alert(name + " Salary: " + (this.defaultCommision + setDefaultSalary()));
}
}

you done with constructor function. now it's time to play with Objects. creating a object of Employee type is easy. JS provided a new Operator for this.

 //Object creation based on your Constructor
var myEmployee = new Employee();

//you can't acess private members
alert(myEmployee.name)// undefined

//you can acess public memebers
alert(myEmployee.defaultCommision);//300

//privilaged method
myEmployee.displayEmployeeInfo();

before going to dig more on the Object Oriented features in JavaScript remember that for JS developers functions are objects... blindly remember objects hold properties and methods.

Few observaions while comparision

Few days back i am debugging some code in my project. while checking some if conditions i observed below behaviors with the == and === operators. may be these will help you in some situations...

var myvar;
alert(myvar)//undefined
alert(typeof(myvar) == undefined); // false
alert(typeof(myvar) === undefined)  // false
alert(typeof(myvar) == "undefined") // true

// different from the  above one
alert(undefined == myvar) //true
alert(undefined === myvar)//true
alert("undefined" == myvar)//false
alert("undefined' === myvar) // false

observation with Boolean is different from undefined
var myvar = false;
alert(typeof(myvar)// boolean
alert(typeof(myvar) == boolean)//ReferenceError: boolean is not defined

alert(typeof(myvar) == "boolean");

alert(typeof(myvar) == "boolean")// true

observations while comparing boolean values with strings
alert(myvar == "")// true -- false is a empty string?
alert("" == myvar) // true -- same result as above
 

alert(typeof(myvar) == typeof(myvar));

alert(undefined === myvar)

alert(typeof(myvar) == "undefined"); 

alert(typeof(myvar) === undefined); 

alert(typeof(myvar) === undefined); alert(typeof(myvar) === undefined);