Date post: | 06-May-2015 |
Category: |
Software |
Upload: | vitali-hornik |
View: | 464 times |
Download: | 0 times |
Vitali Hornik, PMP® Ph.D. in IT (Computer Science)
Do you know everything about JavaScript OOP?
The main code of procedural programming is constantly processing various situations.
The main code of OOP tries to pass responsibility to the executor - system objects.
Procedural Programming vs OOP
Month
1
Month
3
Month
5
Month
7
Month
9
Month
11
Month
13
Month
15
Month
17
Month
19
Month
21
Month
23
Month
250
5
10
15
20
25
30
Pct.OOP
Your efforts and worries at the project
Job satisfaction is inversely proportional to them
…and a new project task will make you totally happy! Like this…
3 major principles of OOP
1. Encapsulation by means of closures
2. Inheritance via prototyping
3. Polymorphism - JS is not a typed language
1. interfaces and abstract classes*
2. final classes
3. protected modifiers
4. static class members
JS doesn’t have
this
var obj = { outerWidth : 20 };function getWidth() { return this.outerWidth; }
var a = getWidth ();var b = getWidth.apply(obj);
this points to the object in the context of which the code works
Can this be changed?
1. var obj = new SomeFunction(…); // the created object
2. obj.publicFunction(….); // obj
3. someFunction.apply(obj,[arg1,arg2,….]); // obj
4. someFunction.call(obj, arg1,arg2,….); // obj
Go ahead!!!
prototype and/or __proto__
function A() {….}
A.prototype – an object with one property «constructor».A.prototype.constructor – function А
A.__proto__ – Function.prototype, the child of Object. Object is the parent of everything.
alert(A.__proto__ === A.prototype.constructor.__proto__ ); // true
A
Function
Object
prototype
__proto__
prototype
__proto__
prototype
prototype – specifies the properties of created objects__proto__ – everything has __proto__ , it serves for parent/child connection
function A(args) {….}var obj = new A(args);
1. var obj = {};2. obj.__proto__ = A.prototype;3. var newConstructor = A.apply(obj, [args]);4. obj = newConstructor instanceof Object ? newConstructor : obj;
alert(obj.prototype); // undefinedalert(obj.__proto__ === A.prototype); // truealert(obj.__proto__.__proto__ === Object.prototype); // true
new
var obj = new A();A.__proto__.p1 = 1; //a property added into constructor
alert (obj.p1); // “undefined”alert (obj.constructor. p1); // “1”
obj.__proto__.p2 = 2;alert(obj.p2); // “2”
A.prototype.p3 = 3;alert(obj.p3); // “3”
A few more words about prototype and __proto__
…dive cheerfully into the code …
Simple object, singleton
var obj = {
v : "prop", AA1 : function(t){
alert(this.v + t);}
}; // "obj" – is "new Object()" that has the keys "v" and "AA1"
obj.AA2 = function(…){…..}; // AA2 key is added to A
obj.AA1(1);obj.AA2();
Simple class
function A() { this.v = 'prop'; return this; }A.prototype.AA1 = function(){…};
var obj = new A(); // “v” – property of the obj object// АА1 – property of the object prototype
A.prototype.AA2 = function(t) { alert(this.v+t); };obj.AA2(2); // that’s why a1.__proto__ === A.prototype worksvar obj2 = A(); // obj2 is a windowobj2.AA1(1); // which doesn’t have AA1
function A() { return this; }A.prototype = {
v : 'prop + ', AA1 : function(){….}
}; // "A.prototype" turned into "new Object()"// А.prototype.constructor is not A
var obj = new A();A.prototype.AA2 = function(){….};obj.AA1();
Kill the constructor
Private membersfunction A(){
var p1 = 1; // visible inside of “A”function privateFunction() { p1=2; }
this.v = 'prop';this.publicFunction = function(){
privateFunction(); alert(this.v+p1);
}}A.prototype.AA1 = function(t){alert(this.v+t)};
var obj = new A();obj.v = 'new value ';obj.AA1(3);obj.publicFunction();
var A = function(){
var p1 = 1;function privateFunction() { p1 = 2; }
function B() { return 1; }B.prototype.v = 'prop ';B.prototype.publicFunction = function(){
privateFunction(); }return B;
}var obj = new ( A() )();
Сomplex class
var A = (function(){
var p1 = 1;
function B() {}B.prototype.setP1 = function(t){p1 = t; }B.prototype.publicFunction = function() { alert(p1); }return B;
})();
var obj1 = new A();obj1.setP1(3);var obj2 = new A();obj2.publicFunction(); // alert "3"
Complex singleton
function extend(Child, Parent) {….} // thx Crockford
function A() { ….. }A.prototype.v = 'prop ';A.prototype.AA1 = function(t){ alert(this.v+t); };
function B(){
this.z = 2;B.superclass.constructor.apply(this, arguments);
}extend(B, A);
var obj = new B();obj.AA1();
Inheritance
Contact info:
• Technical and project manager
• Vitali Hornik, PMP®, Ph.D. in IT (Computer Science)