![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](https://image.slidesharecdn.com/4fronten-140607083840-phpapp01/85/4front-en-8-320.jpg)
![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); // undefined
alert(obj.__proto__ === A.prototype); // true
alert(obj.__proto__.__proto__ === Object.prototype); // true
new](https://image.slidesharecdn.com/4fronten-140607083840-phpapp01/85/4front-en-12-320.jpg)
4front en
- 1. Vitali Hornik, PMPÂź Ph.D. in IT (Computer Science) Do you know everything about JavaScript OOP?
- 2. 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
- 3. 0 5 10 15 20 25 30 Month1 Month3 Month5 Month7 Month9 Month11 Month13 Month15 Month17 Month19 Month21 Month23 Month25 Pct. OOP Your efforts and worries at the project Job satisfaction is inversely proportional to them
- 4. âŠand a new project task will make you totally happy! Like thisâŠ
- 5. 3 major principles of OOP 1. Encapsulation by means of closures 2. Inheritance via prototyping 3. Polymorphism - JS is not a typed language ï
- 6. 1. interfaces and abstract classes* 2. final classes 3. protected modifiers 4. static class members JS doesnât have
- 7. 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
- 8. 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
- 10. 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
- 11. 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
- 12. 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); // undefined alert(obj.__proto__ === A.prototype); // true alert(obj.__proto__.__proto__ === Object.prototype); // true new
- 13. 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__
- 14. âŠdive cheerfully into the code âŠ
- 15. 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();
- 16. 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 works var obj2 = A(); // obj2 is a window obj2.AA1(1); // which doesnât have AA1
- 17. 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
- 18. Private members function 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();
- 19. 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
- 20. 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
- 21. 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
- 22. Contact info: âą Technical and project manager âą Vitali Hornik, PMPÂź, Ph.D. in IT (Computer Science) âą vhornik@gmail.com