article

prototypal inheritance

[WHAT]

] prototypal inheritance

] Prototypal inheritance is all about objects. Objects inherit properties and methods from other objects. That's all there is to it.
] in other OOP languages, there is typically a class keyword that you use to define classes, these classes are like templates that you then use to create objects ( an object is an instance of a class)

] ???

] ? Constructors never come into the picture.?
] ??? The "constructor pattern" of prototypal inheritance. Unfortunately JavaScript uses the constructor pattern of prototypal inheritance ???
? is Crafting your own constructors for producing custom objects,
? also sets up prototypal inheritance for "your object()"instances.,

[WHY]

] advantages of prototypal inheritance VS classical inheritance

] good article that goes in depth as to the whys of prototypal inheritance

] objects are muteable

] you can dynamically add and remove properties and methods from existing objects at runtime

] simple

] no class hierarchies to define and maintain

] powerful

]

] dynamic, better for dynamic languages

]

] smaller code footprint

] less redundant code - using the prototype object of your user created objects, all instances of your object will point to the same function definition, whereas create a new instance of your object will create a copy of each function for each object instance

[WHY NOT]

[WHERE]

]

[WHEN]

]

[EXAMPLE]

] Car inherits from Vehicle -
] Student inherits from Person -

[HOW-TO (simple)]

] define a constructor function for your 'base' object to inherit from,

] EX function Person(name,birthdate) = {}

] define constructor function for the 'inheriting' object,

] EX - Student(course,grade) {}

] use .call() OR apply method of base object FROM within 'the inheriting object' to set the values of properties for the base object

] Person.call(this, 'joe','1990-01-31') - use the call method for single args, comma seperated
] Person.apply(this, arguements) - apply method for multipe args(array)

] use Object.create() to create a new instance of the base object within the inheriting object

] EX Student.prototype = Object.create(Person);

] SET the constructor property of the inheriting object to refer to itself ...

] Student.prototype.constructor = Student;

] CREATE an instance of the new inheriting object

] var myStudent = new Student('computer science','a+');

[HOW-TO (crockford)]

x] there are 2 'commonly used' patterns of using prototypal inheritance

] constructor pattern - wrong - commonly used b/c it is based upon familiar concepts from the java programming lanuage,
] prototypal pattern - correct
] SRC = REF 1

] Create a brand new object.

] There are two ways of creating objects using prototypal inheritance:

] Clone an existing object and extend it.JavaScript offers two ways to clone an object -

] delegation aka CLONE
] concatenation aka COPY
] Henceforth I'll use the word "clone" to exclusively refer to inheritance via delegation, and the word "copy" to exclusively refer to inheritance via concatenation.

[REFERENCE]

] https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain

] the contructor pattern, ] Object.create (es5) and ] classes ( es6)

] http://javascript.crockford.com/prototypal.html

] examples of prototypal inheritance v1
] examples of prototypal inheritance v2
] examples of prototypal inheritance v3

] https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript

] includes example of prototypal inheritance with Person and Student objects, Student inheriting from Person

] https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Details_of_the_Object_Model - JavaScript MDN

] Class based VS prototype based languages

] 2010 q http://stackoverflow.com/questions/2800964/benefits-of-prototypal-inheritance-over-classical

] a 2013 -

] http://stackoverflow.com/questions/2064731/good-example-of-javascripts-prototype-based-inheritance

]

] http://javascript.info/tutorial/inheritance

] animal / rabbit example, __proto___,
] rabbit.__proto__ = animal // inherit ||
] rabbit = Object.create(animal) ||
] Rabbit.prototype = animal
] var rabbit = new Rabbit('John')

] http://www.2ality.com/2012/01/js-inheritance-by-example.html

] Dr Axel Rauschmeyer -

] https://en.wikipedia.org/wiki/Prototype-based_programming

true prototypal inheritiance ( crockford v1 2006-06-07)

] function object(o) {
        function F() {}
        F.prototype = o;
        return new F();
    }

The object function untangles JavaScript's constructor pattern, achieving true prototypal inheritance. It takes an old object as a parameter and returns an empty new object that inherits from the old one. If we attempt to obtain a member from the new object, and it lacks that key, then the old object will supply the member. Objects inherit from objects. What could be more object oriented than that?

The problem with the object function is that it is global, and globals are clearly problematic.

true prototypal inheritiance ( crockford v2 2007-04-02)

Object.prototype.begetObject = function () {
    function F() {}
    F.prototype = this;
    return new F();
};

newObject = oldObject.begetObject();

The problem with Object.prototype.begetObject is that it trips up incompetent programs, and it can produce unexpected results when begetObject is overridden.

true prototypal inheritiance ( crockford v2 2008-04-7)

if (typeof Object.create !== 'function') {
    Object.create = function (o) {
        function F() {}
        F.prototype = o;
        return new F();
    };
}

NOTES from article # 1682 - adding methods and properties to existing objects

[2012-09-01]

] (id=703) UPDATED - object.prototype - using prototype (property) to add new properties & methods to (existing) objects

] example 3 - adding NEW properties(only) to existing objects,

[2012-09-02]

*] namespace -

IF you create a constructor function and then define all of the methods for all of your objects in the "global" namespace, you will end up with 'ns pollution' and 'naming conflicts' - to avoid that ...

*] why= use prototype and NOT just declare/define your methods in the - ] constructor function , ] json or ] literal

B/C - IF you define your method (or property) in the constructor/json/literal declaration, EVERY single instance of your object will be created with a copy of your method code,
IF you define your method (or property) using prototype, one copy of your method code will be created and every single instance of your object will REFER to that 1 copy
REF #] 004 - see comments section for notes on both of these

newObject = Object.create(oldObject);

] jsISsexy - art - oop in js
] eric says dont use constructor pattern - http://ericleads.com/2013/02/fluent-javascript-three-different-kinds-of-prototypal-oo/
] http://ejohn.org/blog/simple-javascript-inheritance/
] crockford proto pattern ] http://javascript.crockford.com/prototypal.html see example below

CROCKFORD method

if (typeof Object.create !== 'function') {
    Object.create = function (o) {
        function F() {}
        F.prototype = o;
        return new F();
    };
}
newObject = Object.create(oldObject);

ERIC method

var proto={

hello:functionhello(){

return'Hello, my name is '+this.name;

}

};

var george=Object.create(proto);

george.name='George';

http://stackoverflow.com/questions/14781373/can-anyone-come-up-with-a-good-prototype-example-in-js-that-helps-me-understand?lq=1
- person.prototype.haircolor = brown; // add a new property to all previously instantiate instances of
http://stackoverflow.com/questions/8659390/context-to-use-call-and-apply-in-javascript
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply
https://gist.github.com/wendyleung/4cbd95baa9b147abc087 ( call vs apply)
https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/create

http://pixdeo.com/articles/Inventory%20Items%20and%20prototypal%20inheritance/ - SRC=hn, USER=, COMMENTS(#),

Details Photos Edit more