WordCamp Nashville 2016

bobby | @mrbobbybryant #wcnash

Javascript Prototypal Inheritance.

How its different, and why you need to know itBobby Bryant

Bobby Bryant | @mrbobbybryant #wcnash

About Me

• Web Engineer at 10up

• Father of 3

• JavaScript Junkie


Why Cover such a weird topic?


–Kyle Simpson @getify

“Where it takes a pretty in-depth knowledge of a language like C or C++ to write a full-scale

program, full-scale production JavaScript can, and often does, barely scratch the surface of

what the language can do.”

https://github.com/getify/You-Dont-Know-JS

https://github.com/getify/You-Dont-Know-JS


Classical vs Prototypal Inheritance


Classical Inheritance• Allows you to create new objects using a class as a blueprint.

• A blueprint as a few characteristics that make it distinct.

• It implies that if you follow the instruction you will successfully create your object.

• Class Based languages are built around the concept of:

• Building base classes.

• Extending the base classes to build a hierarchy of inheritance.


Classical Inheritance

• Class Based languages are built around the concept of:

• Building Base Classes.

• Extending the base classes to build a hierarchy of inheritance.


Prototypal Inheritance• A prototype is one step farther than a blueprint.

• It implies that you have a working version of something.

• It not a contract that says if you follow these steps you will have a working object.

• It implies that, “here is a working object, use it as is or make copies if you want.”


How Does JavaScript use these prototypes?


Lots of them


Understanding the Prototype


Prototypal Inheritance


Static Methods


Real World Example


Constructor


Extending a Prototype


Object Literal


Delegation


Object Creation Patterns


Object.create


Factory Function


Factory Fn #2


Composition vs Inheritance


Currently in the larger JS world, there is actually a completely different paradigm growing. Functional Programming. And at its core

functional programming is about Composition over Inheritance.


Object.assign


Composition


ES6 Classes


Is class syntax in ECMAScript 6 just a syntactic sugar for classical prototypes?

https://www.quora.com/Is-class-syntax-in-ECMAScript-6-just-a-syntactic-sugar-for-classical-prototypes

https://www.quora.com/Is-class-syntax-in-ECMAScript-6-just-a-syntactic-sugar-for-classical-prototypes


Delegation again

bobby | @mrbobbybryant #wcnash

Thank You!I have a Javascript Problem.

WordCamp Nashville 2016

Internet

Transcript of WordCamp Nashville 2016