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.

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

7. function
function f() {};
f();
new f;

8. function
function f() {};
f();
new f;

9. function
function f() {};
f();
new f;

10. Object
Number
String
Boolean
Function
Array
RegExp
Date

11. A
function A() {};

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

30. Thank You
dmitry@baranovskiy.com