Demystifying Prototypes
25 likes5,734 views
This document summarizes JavaScript prototypal inheritance and object-oriented patterns. It explains the prototype chain and how properties are inherited through the prototype of an object's constructor. It demonstrates how to properly set up inheritance by assigning the parent constructor's prototype to the child constructor.
![b.name
b[“name”]
“a” in b
for (var i in b) …
b.hasOwnProperty(“a”)
b instanceof d](https://image.slidesharecdn.com/proto-101215185312-phpapp01/85/Demystifying-Prototypes-5-320.jpg)
Demystifying Prototypes
- 1. Demystifying Proto........... types
- 2. types
- 3. null undefined number string boolean object
- 4. null undefined number string boolean object
- 5. b.name b[“name”] “a” in b for (var i in b) … b.hasOwnProperty(“a”) b instanceof d
- 12. constructor: A A function A() {};
- 13. constructor: A A b function A() {}; var b = new A;
- 14. constructor: A A x: 1 b function A() {}; var b = new A; A.prototype.x = 1;
- 15. constructor: A A x: 1 b y: 2 function A() {}; var b = new A; A.prototype.x = 1; b.y = 2;
- 16. constructor: A A x: 1 c b y: 2 function A() {}; var b = new A; A.prototype.x = 1; b.y = 2; var c = new A;
- 17. constructor: A A x: 1 c b y: 2 function A() {}; var b = new A; A.prototype.x = 1; b.y = 2; var c = new A; A.prototype = {v: 1, w: 2};
- 18. v: 1 constructor: A w: 2 A x: 1 c b y: 2 function A() {}; var b = new A; A.prototype.x = 1; b.y = 2; var c = new A; A.prototype = {v: 1, w: 2};
- 19. v: 1 constructor: A w: 2 A x: 1 d c b y: 2 function A() {}; var b = new A; A.prototype.x = 1; b.y = 2; var c = new A; A.prototype = {v: 1, w: 2}; var d = new A;
- 20. v: 1 constructor: A w: 2 A P x: 1 d c b y: 2 P.hasOwnProperty(“constructor”) “constructor” in c for (var i in P) alert(i); c.constructor c instanceof A d instanceof A d.constructor
- 21. null Object A c d
- 22. null Object function A() {}; function B() {}; B.prototype = new A; A var d = new B; B d
- 23. null Object function A() {…}; function B() {}; var Z = function () {}; A Z.prototype = A.prototype; B.prototype = new Z; var d = new B; B d
- 24. null Object function A() {…}; function B() {}; var Z = function () {}; A Z.prototype = A.prototype; B.prototype = new Z; Z var d = new B; B d
- 25. goog.inherits = function(childCtor, parentCtor) { /** @constructor */ function tempCtor() {}; tempCtor.prototype = parentCtor.prototype; childCtor.superClass_ = parentCtor.prototype; childCtor.prototype = new tempCtor(); childCtor.prototype.constructor = childCtor; };
- 26. exports.inherits = function(ctor, superCtor) { ctor.super_ = superCtor; ctor.prototype = Object.create(superCtor.prototype, { constructor: { value: ctor, enumerable: false } }); };
- 27. null Object Function A
- 28. null Object Function A
- 29. JavaScript Paradox Function.constructor === Function