guildcrafts / core-object-oriented-javascript

Core Object Oriented JavaScript

A day-by-day structured deep dive into object-oriented JavaScript. Read articles, watch videos, complete lessons and exercises, and implement a final project.

Day 1: Scopes & Closures

Your objectives for the day is to:

• Learn about JavaScript’s variable scoping, including lexical scopes and dynamics scopes.
• Learn about Closures
• Learn about the Keyword "this"
• Learn about Prototypes

Scopes

• Watch these videos on Type and Scope
  • https://shereef.wistia.com/medias/mlnjxm9z9s
  • https://shereef.wistia.com/medias/hn99v12lkr
  • https://shereef.wistia.com/medias/6snmj6es7v
  • https://shereef.wistia.com/medias/5bva01dxbw
• Signup for Udacity Object Oriented Javascript
• Complete the Scopes lesson

Closures

• Complete the Closures lesson

Day 2: Objects and "this"

Objects

• Watch Video introduction to Object Oriented Javascript (1 Hour)
• Read Javascript Objects in Detail
• Read pages 173 to 184 in Professional JS for Web Developers
• Signup for a free Team Treehouse trial and complete their [Object Oriented Javascript Course] (https://teamtreehouse.com/library/objectoriented-javascript)
• Skim this cheat sheet

This

• Watch these videos:
  • https://shereef.wistia.com/medias/wfybhl2nmr
  • https://shereef.wistia.com/medias/kqbedkmm13
• Read Undrestanding Javascrpt's This with Clarity and Mastery
• Read What is this in Javascript
• Complete the Keyword "this" lesson

Stretch

• Do exercises for Chapter 4 of Object Oriented Javascript (and maybe read it)
• Study these top 50 OOPs interview questions

Day 3: Prototype and Inheritance

• Watch these videos on Prototypes:
  • https://shereef.wistia.com/medias/a5m8nwq4su
  • https://shereef.wistia.com/medias/ednchu35gz
  • https://shereef.wistia.com/medias/yejzrin760
  • https://shereef.wistia.com/medias/372u07ybvu
  • https://shereef.wistia.com/medias/xxj6323pk9
• Read Prototype in Plain English
• Read OOP in Javascript
• Complete the Prototype Chains Lesson on Udacity
• Complete the Prototypal Classes Lesson on Udacity

Stretch

• Read pages 184 to 201 in Professional JS for Web Developers
• Read Understanding Javascript Prototypes
• Read sections 7 in JS Ninja
• Do exercises for Chapter 5 of Object Oriented Javascript (and maybe read it)
• Do exercises for Chapter 6 of Object Oriented Javascript (and maybe read it)

Day 4: Deeper Dive and Final Project

• Complete the Object Decorator Pattern Lesson on Udacity
• Complete the Functional Classes Lesson on Udacity
• Complete the Pseudoclassical Patterns Lesson on Udacity
• Complete the Superclass and Subclass Patterns Lesson on Udacity
• Complete the Pseudoclassical Sublasses Lesson on Udacity
• Start (and maybe finish) the Final Project Lesson on Udacity

Day 5: Final Project and check your understanding

• Complete the Final Project Lesson on Udacity

Do you know/understand:

• Everything in this article
• Everything in this cheat sheet
• The difference between Classic Inheritance and Prototypical Inheritance
• The difference between private variable, public variable and static variable? How we achieve this in JS?
• How to add/remove properties to object in run time?
• How to achieve inheritance ?
• How to extend built-in objects?
• What is Object in JavaScript?
• What is the Prototype object in JavaScript and how it is used?
• What is "this"? What is its value?
• Explain why "self" is needed instead of "this".
• What is a Closure and why are they so useful to us?
• Explain how to write class methods vs. instance methods.
• Can you explain the difference between == and ===?

Stretch Goals

• Complete the learn-js OO tutorial
• Complete the learn-js function context tutorial
• Complete the learn-js inheritance tutorial
• Read Object Oriented Javascript for Beginners
• Read Chapter 8 of Eloquent Javascript
• Read The Basics of Object Oriented Javascript
• Study this OOP interview questions
• Go over these object oriented javascript interview questions
• Complete these 3 practice exercises
• Complete section 2 of these exercises