What is Object Oriented Programming (OOP)?

What is Object Oriented Programming (OOP)?

A way of representing things as collections of code with data and actions, including mechanisms for reusing code among related collections.

OOP Core Concepts

• Abstraction

  "Abstraction is the stripping away of details so that you can see the essence." (Douglas Hofstatder)

OOP Core Concepts

• Abstraction
• Encapsulation

  Creating an interface for your object model and abstracting the implementation of the actions of that model.

OOP Core Concepts

• Abstraction
• Encapsulation
• Inheritance

  Can you explain the relationship between two objects "A" and "B" by: "A is a B" within the code structure provided in the language?

OOP Core Concepts

• Abstraction
• Encapsulation
• Inheritance
• Polymorphism

  Literally: "many forms". The ability for a member of a collection to have different forms within the inheritance chain without changing the interface exposed outside the object.

OOP Secondary Concepts

• Public, private, & protected
• Static members
• Interfaces
• Abstracts

OOP Secondary Concepts

• Public, private, & protected privileged
• Static members
• Interfaces Mixins
• Abstracts

But JavaScript isn't really
object oriented...

Even our functions are objects!

FYI, while undefined is clearly not an object,
null is: typeof null === "object"

Simple Objects

Calling object methods

this inside an object method refers to the current context.

Context is typically the variable before the "." when called:
this === literalDog inside speak()

Why not use object literals?

• Limited reusability
• More difficult for inheritance
• Verbose
• Poor abstraction

Constructors

A Dog by any other name...

What have we created?

The "new" keyword

The "new" keyword

In fact, we can do these actions on our own:

Note that Object.create() does not exist in IE < 9, but you can use a shim.

A better Dog

What about name and speaknot being on the prototype?
We probably want them to be...

A prototypical Dog

Dun dun dun...

(That's pronounced "dunder proto", as in: "double underscore proto")

Dunder proto no more

__proto__ has existed for a long time, and in ES6/ES2015 it is deprecated

Member Access Types

public, private, privileged

Public Members

Anything attached to the prototype:

Public Members

Anything on this or a reference to the object instance:

Private Variables

And privileged methods

Private Variables

Variables declared inside a function block only exist while that function's execution context exists.

Priveleged Methods

If we want access to a private variable we have to create a "privileged" method...

Access to the alive variable from isAlive() and die() is possible because functions in JavaScript are closures.

Closures

Closures

Closures

Closures

Closures

Closures

Closures

Priveleged Methods

If we want access to a private variable we have to create a "privileged" method...

Priveleged Methods

Priveleged Methods

Inheritance!

Inheritance

Our New Chain

Our New Chain

Checking instances

Polymorphism
and Parent Methods

Parent Method Declaration

Parent Method Declaration

Mixins

Interfaces

Define the Mixin

Mixing it in

We need to copy our properties and methods
from the mixin to the desired prototype...

Use a helper method!!

Mixing it in - Use a helper method!

Mix it in

Using the Mixin

The Future

ES6/ES2015 Classes

ES6/ES2015 Classes

This looks nice, but it's just syntactic sugar!

In my opinion, this will just lead to more confusion...

Don't write a framework!