framework prototype

Framework Prototype

purpose of presentation

is to write prototypal oopjavascript application

prototype framework

JavaScript Framework that aims to give advanced class-driven features

language frameworks

reusable set of libraries or classes thatis designed to support a language in

specific matter

language frameworks

reusable set of libraries or classes thatis designed to support a language in

specific matter

such as dotNet framework, jquery framework, Zend framework and prototype framework

javascript language

object-oriented client-side scripting language

javascript language

object-oriented client-side scripting languagejavascript is leading new era of windows applications

Fierce competition over javascript

Prototype JS - Dojotoolkit - Developer.Yahoo - Spry

Rico - Mootools - Sproutcore - Qooxdoo

Midori JS - ArchetypeJS - SimpleJS - JQuery

JS.Fleegix - Uize - Mochikit - Rialto

Fierce competition over javascript

Prototype JS - Dojotoolkit - Developer.Yahoo - Spry

Rico - Mootools - Sproutcore - Qooxdoo

Midori JS - ArchetypeJS - SimpleJS - jQuery

JS.Fleegix - Uize - Mochikit - Rialto

Top frameworks

Top frameworks

jQuery : the highest functionalitySpry : the best ajax frameworkprototype : the best oop supporter

Top frameworks

jQuery : the highest functionalitySpry : the best ajax frameworkprototype : the best oop supporter

(this is why)?..

How to install?..

http://www.prototypejs.org/

download v1.7.0.1 since November 16, 2010

<script type="text/javascript" src="prototype.js>"/<script>

oop concepts

1 -Encapsulation or classification2 -Data abstraction

3 -Inheritance4 -Polymorphism

oop concepts

1 -Encapsulation or classification2 -Data abstraction

3 -Inheritance4 -Polymorphism

5 -Aggregation or containment

Encapsulation

classification of methods and propertiesthat is every class is capsulethen the instance of the class is called

Encapsulation

classification of methods and propertiesthat is every class is capsulethen the instance of the class is called object

javascript Encapsulation

class-less.. classes .. methods .. constrictorsdefined as functionno direct access modifiers

class declerationfunction Class_Name(parameters){

this.property_name = value; this.method_name = methodName;

}//or class declaration is the constructor

function Class_Name(parameters){

this.property_name = value; this.method_name = function methodName)(

;}...{}

prototype class decleration

var Class_Name = Class.create;)( Class_Name.prototype{ =

initialize: function(parameters){ //constructor

this.property_name1 = value1; this.property_name2 = value2;

} method_name:function(parameters)

}......{ }

prototype class decleration

var Class_Name = Class.create({

initialize: function(parameters){ //constructor

this.property_name1 = value1; this.property_name2 = value2;

} method_name:function(parameters)

}......{ ;)}

instancing

var obj = new Class_Name(parameters);

var x = obj.property_name;obj.method_name;)(

javascript modifiers

public private priviliged

javascript modifierspublic: can be accessed from outside the class function Class_Name(parameters){

this.method_name = methodName;}

//orfunction Class_Name(parameters){Class_Name.prototype.method_name = methodName;

obj.method_name};)(

javascript modifiers

private : can't be accessed from outside the class//basic idea is that the member isn't included

by this keywordfunction Class_Name(parameters){

function methodName}{)(}

obj.methodName;)(

javascript modifiers

private : can't be accessed from outside the class//basic idea is that the member isn't included

by this keywordfunction Class_Name(parameters){

function methodName}{)(}

obj.methodName;)(

javascript modifierspriviliged : public function that is in the class that can access private methodsfunction Class_Name(parameters){

function methodName}...{)( this.pmethod_name =

function(){methodName();};}

//orfunction Class_Name(parameters){

function methodName}...{)( Class_Name.prototype.pmethod_name =

function(){methodName();};}

obj.pmethod_name;)(

Data abstraction

the process of making Summarized description for the common area of properties and methodsthat is not a class

Data abstraction

the process of making Summarized description for the common area of properties and methodsthat is not a class

No real data abstraction in client-scripting

Inheritance

relation between classes when a class has all the properties and methods of the otherthe small is called parent

javascript Inheritance

classical or class-based Inheritanceprototypal Inheritance

classical inheritance

*/we include the parent in the son class by the running of the parent

class as part of the son /* function parent(parameters)}...{

function son{)(this.inheritFrom = parent;this.inheritFrom(parameters);

}

prototypal Inheritance

Object.extend(parentobj,sonobj)and if sonobj was not created yet then....

Class.create(Object.extend(parentobj,sonobj))

prototypal Inheritance

var parent = Class.create;)}....{(var son = class.create(Object.extend(

new parent;))}......{,)(

polymorphism

the method apperance in many-shapes amonginherited classes and every class implements its own method then only one is called)(

polymorphism

polymorphism

polymorphism

Only key marking is supported in javascript for accessing the higher polymorphic method we use $super

we need just Class.create)(Class.create(parent,sonobj) ;

polymorphism

var parent = Class.create{(method_name:function(parameters)}....{

;)}var son = class.create(parent{,

method_name: function($super,parameters){$super(parameters)}

;)}

Aggregation

the concept that is talking about the ability of class to contain anotherobject

Key Words

mix-in modules Native extensionsValue and refrence in prototypePrototype DOM supportPrototype API’sJSON in prototype

Prototype Framework

Prototype Framework

Prototype Creator