Javascript CREATING OBJECTS AND METHODS

var MyNamespace = {
	myFunc1: function(somePara) {
		//code
	},
	myFunc2: function(somePara) {
		//code
	},
	message: "Hello World",
	count: 53
}
Calls
MyNamespace.myFunc1(someParaValues);
MyNamespace.message = "Good bye";

Namespaces do not provide any privacy or enacapsulation, are all global vars. NOTE: use namespace WORD is a way to control C) Strict Mode If you omit var keyword var becomes global!

function fun() {
	var code = 1;
	count = 10;    // GLOBAL
	"use strict";  //will not become global
}

SINGLETON OBJS AND GLOBAL FUNCS IN JS

var radius = 100 * Math.random();
var area = Math.PI * Math.pow(radius, 2);
JSON convert value
var anObj
var anObjAsJSONString = JSON.stringify(anObj)
var anObjAgain = JSON.parse(anObjAsJSONString);

GLOBAL COMMON FUNCTIONS

var age = parseInt(ageEnteredByUser);
var height = parseFloat(hByUser);
if (isNan(age) || isNan(height))
	alert("Invalid input);
The isNaN() function determines whether a value is an illegal number (Not-a-Number).
This function returns true if the value is NaN, and false if not
JSON .parse     - (receive the json)
JSON .stringfy  - (send object data)
CREAING NEW OBJECTS
var employee1 = new Object();
var employee2 = {};
Creating objects properties and methods
employee1.name = "John Smith";
employe1.salary = 1000;
employee1.payRise = function(amount) {
//inside a method, 'this' means the current object (go up the code until the object)
	this.salary += amount;
	return this.salary;
}/
var newSalary = employee1.payRise(500);
document.write("New salary " + newSalary);

NOTE: JS does not support function overloading, it will overwrite the last one. No need to create a class, create directly an object. Using Object Literal Notation (More clear)

var employee2 = {
	name: "Mary Jones",
	salary: 2000,
	payRise: function(amount) {
		this.salary += amount;
		return this.salary;
	},
	displayDetails: function() {
		alert(this.name + " is " + this.age + " and earns " + this.salary);
	}
};

CONSTRUCTORS Create functions are used to easily create new objects with the specified properties. variable that receives a function is a method, to be called ‘this’

var Account = function (id, name) {
	this.id = id;
	this.name = name;
	this.balance = 0;
	this.numTrans = 0;
};
var acc1 = new Account(1, "John");
var acc2 = new Account(2, "Mary");
acc1.constructor both reference to Account construct function.

After you have defined a constructor function, you can use the constructor to create a new object by using the new keyword. You can pass parameters into the constructor function to specify the initial values for the object. When you create an object by using the new keyword, JavaScript performs the following steps: 1. creates new obj 2. set constructor property to reference to a constructor function 3. Assigns ‘this’ to refer to the new obj 4. invokes code to set properties on the obj Using Prototypes With the constructor there is a waste of resources because each code is a copy of the same. Prototype is an object which u can assign new properties and methods, use it as a blueprint.

Account.protoype = {
	deposit: function(amount) {
		this.balance += amount;
		this.numTrans++;
	displayDetails: function() [
		alert(this.id + ", " + this.name + " balance $" + this.balance);
	}
};
var acc1 = new Account(1, "john");
acc1.deposit(100);
acc1.DisplayDetials;

This Object provides functionality such as the toString method. Using the Object.create Method

var Account = function(id, name) { .. };
Account.prototype = { .. };
acc1 = new Account(...);
//create na obj by using the Account prototype
var obj2 = Object.create(Object.getPropertyOf(acc1));

acc1 object was created by using the Account constructor EXTENDING OBJECTS In JS everything is an object. Is is possible to implement object-oriented feature such as inheritance and encapsulation. A) Implementing Encapsulation It shields external code from the internal workgins of a class. Javascript does not have public/protected/private to specify access. But it uses a technice known as CLOSURES to achieve encapsulations.

var person - function(name, age)
{
	//priavete, inside a func
	var _name,_age;
	//public access funcs
	this.getName = function()
	{
		return _name;
	}
}

The general syntax for the Object.create() method is as follows: Object.create(prototypeObject, propertiesObject) The prototypeObject parameter specifies the object to use as the prototype for the new object. You can invoke the Object.getPrototypeOf() method if you want to obtain the prototype of an existing object to use here. The propertiesObject parameter is optional, and specifies an object whose properties will be added into the new object. This object takes the form of a collection of property descriptors. A property descriptor specifies the value stored in the property, and can also specify other attributes such as whether the property is read-only or can be updated; properties are read-only unless you set the writable attribute to true. The following example creates an object by using a null prototype, and adds two simple properties:

var obj1 = Object.create(null, {
prop1: {value: "hello", writable: true}, // read/write property
prop2: {value: "world" } // read-only property
});

IMPLEMENTING INHERITANCE BY CHANING PROTOTYPES You implement inheritance by defining an object that extends an existing object. Object.create function to implement 1. Define at base constructor and prototype 2. Define the derived constructor 3. Set the prototype property of the dervied constructor to be an instance of the base object. 4. Reset the constructor property in the dervied prototype so that it refers back to the dereived constructor. Adding Func to Existing Object

var Account = function (id, name) { ... };
// Account prototype, same as before.
Account.prototype = { ... };
acc1 = new Account(...);
// Create an object by using the Account prototype.
var obj2 = Object.create(Object.getPrototypeOf(acc1
));

The acc1 object was created by using the Account constructor function which references the prototype that contains the deposit, withdraw, and displayDetails methods INHERITANCE USING PROTOTYPE CHAINING more refined control over the inheritance mechanism is to make use of constructor function prototypes, as follows: 1. Define the base constructor and prototype. 2. Define the derived constructor. 3. Set the prototype property of the derived constructor to be an instance of the base object. This ensures that the derived object has access to all the members defined in the base prototype. 4. Reset the constructor property in the derived prototype so that it refers back to the derived constructor.

// Base constructor.
var Person = function(name, age) {
this.name = name;
this.age = age;
}
// Base prototype.
Person.prototype = {
haveBirthday: function() {
this.age++;
}
};
// Derived constructor.
var Student = function(name, age, subject) {
this.name = name;
this.age = age;
this.subject = subject;
}
// Set the derived prototype to be the same object as the base prototype,
// and reset that derived prototype so that it uses the correct constructor.
Student.prototype = new Person();
Student.prototype.constructor = Student;
// Create a derived object and invoke any methods defined in the object or one of its
// parents. JavaScript uses prototype chaining to locate methods up the inheritance tree.
var aStudent = new Student("Jim", 20, "Physics");
aStudent.subject = "BioChemistry";
aStudent.haveBirthday();
alert(aStudent.age);

ADDING FUNCTIONALITY TO EXISTING OBJECTS To extend the functionality of an object, follow these steps: 1) Get the prototype for an object. 2) Assign a new property to the object, to represent the new feature that you want to add.

var Point = function(x,y){
	this.x = x,
	this.y = y,
};
Point.prototype.moveBy = function(deltaX, deltaY) {
	this.x += deltaX;
	this.y += deltaY;
}
Point.prototype.moveTo = function(otherPoint) {
	this.x = otherPoint.x;
	this.y = otherPoint.y;
}
var p1= new Point(100, 200);
p1.moveBy(10, 20);
var p2= new Point(25, 50);
p2.moveTo(p1);
alert("p2.x: " + p2.x + " p2.y: " + p2.y);

The following example shows how to add functionality to an existing object. The code defines a constructor function named Point, to represent a coordinate point that has x and y properties. The code then adds methods named moveBy() and moveTo() to the prototype object for Point, and shows how these methods are available on all Point objects. APPLY METHOD WITH GENERIC FUNCTIONS

function SetColor(color) {
	this.color = color;
}
SetColor.apply(p1, ["red"]);
alert(p1.color); // Displays "red"

The Point object, p1, is passed as the this parameter, and the parameter list containing the single string “red” is passed as the color parameter to the SetColor method. The result is that the color property of p1 is set to “red”. (updated Jul. 2014)]]>

Leave a Reply Cancel reply