JavaScript(5) 面向对象

How to create an object?

It's easy,var o= new object() or var o={}.

How to create an object with object-oriented concept?

Factory pattern

Factory pattern is famous as a basic pattern of design art.Proper object is returned by Factory Pattern in different conditions.

//BI layer
function root(){};
root.prototype.numa = 0;
root.prototype.numb = 0;
function adder(){
	var _o = new root();
	_o.calc=function(){
		return this.numa + this.numb;
	}
	return _o;
}
function subtracter(){
	var _o = new root();
	_o.calc=function(){
		return this.numa - this.numb;
	}
	return _o;
}
//This is a basic factory,It returns a calculator base on signal.
function Calculator(signal){
	switch (signal)
	{
		case "+":return new adder();
		case "-":return new subtracter();
		default:return undefined;
	}
}

//UI layer
//in this layer,if the signal is inputted by UI,the type of the object is unknown untill the script is running.
var calc=new Calculator("-");
calc.numa=1.2;
calc.numb=0.7;
alert(calc.calc());//0.5

The code upside, Calculator(signal) is a Factory-Pattern function. So when you want to add a new calculator named  multiplier( the signal is a *),just a  Multiplier() is added in BI(Obviously a case is added in  Calculator(signal));

Constructor Pattern

The type of object created by factory-pattern can not been identified.Then Constructor Pattern solves the problem.Just take a comparison of the two patterns:

//factory pattern
function facPattern(name,age){
	var _o=new Object();
	_o.name=name;
	_o.age=age;
	_o.printInf=function(){alert("name:"+this.name+"\nage:"+this.age);}
	return _o;
}
//constructor pattern
function ConsPattern(name,age){
	this.name=name;
	this.age=age;
	this.printInf=function(){alert("name:"+this.name+"\nage:"+this.age);}
}

var fac=new facPattern("Lucy",16);
var con=new ConsPattern("Lucy",16);

alert(fac instanceof facPattern);//false:factory pattern created object cannot been identified
alert(con instanceof ConsPattern);//true:can been identified

You already know that when reference-types token to a comparison,they are equal only when they assigned to  references pointed to the same object.Now you know the problem of Constructor Pattern,do you?

Think about this:when a constructor is called n times,its reference variables are copied n times,they are totally the same.In other words, it is not necessary!

Prototype Pattern

To resolved the problem of reference variable times copied,you can defined the reference variable outside of the constructor-pattern function,just like this:

function printInf(){
	alert("name:"+this.name+"\nage:"+this.age);
}
//constructor pattern
function ConsPattern(name,age){
	this.name=name;
	this.age=age;
	this.printInf = printInf;
}

var con1=new ConsPattern("Lucy",16);
var con2=new ConsPattern("Lily",11);
alert(con1.printInf == con2.printInf);//true

printInf() is a function,it is a reference type.If it was defined inside of a constructor,then every instance of the constructor will create a printInf(),they are real objects,not references pointed to the same object so when you using a "==" operator to test hey are equal or not,you get a false.

The code upside is not elegant,isn't it?So let introduce the Prototype Pattern.

You already get the basic of prototype.I mean,if you had read this series blog.

Every function is created with a prototype,every instance of Constructor function shares the same prototype.So how about storing the references in prototype?

//constructor pattern
function ConsPattern(name,age){
	this.name=name;
	this.age=age;
}

ConsPattern.prototype.printInf=function(){
	alert("name:"+this.name+"\nage:"+this.age);
}

var con1=new ConsPattern("Lucy",16);
var con2=new ConsPattern("Lily",11);
con1.printInf();
con2.printInf();