Byte-Sized-Chunks: Dynamic Prototypes in Javascript
4.0 (7 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
1,494 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Byte-Sized-Chunks: Dynamic Prototypes in Javascript to your Wishlist.

Add to Wishlist

Byte-Sized-Chunks: Dynamic Prototypes in Javascript

Master Javascript's way of doing inheritance - via Dynamic Prototypes!
4.0 (7 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
1,494 students enrolled
Created by Loony Corn
Last updated 3/2016
Current price: $10 Original price: $20 Discount: 50% off
5 hours left at this price!
30-Day Money-Back Guarantee
  • 3 hours on-demand video
  • 42 Supplemental Resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Master inheritance in Javascript
  • Understand what dynamic prototyping is, and its benefits and pitfalls
  • Understand the use-cases for prototyping and inheritance
View Curriculum
  • Any modern browser and a simple text editor are all that will be needed for the code examples
  • Some prior programming experience will definitely help!

Note: This course is a subset of our much longer course 'Learn By Example: HTML, CSS and Javascript' so please don't sign up for both:-)

Javascript objects, prototypes and JSON - that's what this course is about.

This is not a course on Javascript frameworks - its about solid, fundamental Javascript. You'll be surprised by how much more you can get done on your web pages once you learn these technologies the right way.

What do we mean by that?

  • Relatively few folks formally learn HTML, CSS or Javascript, because its quite easy to get stuff done in these technologies in a "quick-and-dirty way".
  • That "quick-and-dirty" way of learning and doing leads to problems over time, because Javascript and CSS are actually quite complex, so it is easy to do things the wrong way
  • This course will help, because it is entirely built atop examples. Each is self-contained, has its source code attached, and gets across a simple, specific use-case. Each example is simple, but not simplistic.

What's Included:

  • Prototypes are Javascript's way of doing inheritance, and its very different from the C++/Java way of doing it.
  • JSON is not conceptually difficult to use, but it is incredibly important, and you should understand why - because its the glue between backends written in Java or other traditional languages, and front-ends written in Javascript
  • The Document-Object-Model is what ties Javascript back to HTML and CSS. Together with JSON, the DOM ties it all together from server to skin.

Using discussion forums

Please use the discussion forums on this course to engage with other students and to help each other out. Unfortunately, much as we would like to, it is not possible for us at Loonycorn to respond to individual questions from students:-(

We're super small and self-funded with only 2 people developing technical video content. Our mission is to make high-quality courses available at super low prices.

The only way to keep our prices this low is to *NOT offer additional technical support over email or in-person*. The truth is, direct support is hugely expensive and just does not scale.

We understand that this is not ideal and that a lot of students might benefit from this additional support. Hiring resources for additional support would make our offering much more expensive, thus defeating our original purpose.

It is a hard trade-off.

Thank you for your patience and understanding!

Who is the target audience?
  • Nope! Please don't enroll for this class if you have already enrolled for our 13-hour course 'Foundations of HTML, CSS and Javascript' course
  • Yep! Folks who are seeking to learn Javascript the right way - including folks who may done some Javascript programming, but are not quite confident using advanced features such as dynamic prototyping
  • Nope! This class is not right for you if you are looking to learn Javascript frameworks such as JQuery, Angular or Node.js
Students Who Viewed This Course Also Viewed
Curriculum For This Course
24 Lectures
A Different Take on Objects
24 Lectures 02:46:16

Javascript objects are very different from C++ and Java objects! It's quite a paradigm change if you've programmed in other languages before.
Preview 10:58

JSON can be used as a textual representation of a JS object. You can construct an object using JSON notation.
Example 15: Creating an object using JSON

Object constructors are just functions with two specific differences. The use of the magical keyword "this" within the constructor and the use of the magical keyword "new" to create an object from the constructor
Example 16: Creating an object using a constructor

You can add properties to an object after it's been constructed on the fly! Pretty mind-bending for programmers from other object oriented languages.
Example 17: Adding properties to objects dynamically

You can also remove properties from objects after they have been constructed. Again not allowed in traditional object oriented languages!

Example 18: Removing properties from objects dynamically

Functions are first class citizens in Javascript which means that object properties can be function as well.
Example 19: Object properties can be functions

Object properties defined in constructors can be functions as well! Again because functions are first class citizens.
Example 20: Object constructors can have property functions

Properties of objects can be accessed using the dot "." notation as well as the square brackets "[]" notation. They are essentially the same.

Example 21: Two ways of accessing object properties

A special for loop exists to loop over object properties. Every object supports this thanks to the base Object class!
Example 22: Iterating over all properties in an object

Bad things happen when you call an object constructor without the new keyword.
Example 23: Calling a constructor without new

The typeof operator tells you whether a variable is a number, string, object or undefined. It cannot differentiate between different types of objects though.
Example 24: Understanding the typeof operator

Use the instanceof operator to figure out what constructor was used to create an object. This only recognizes where the object came from, it does not know what changes were made to the object after it was constructed.
Example 25: Paternity tests using instanceof

Properties are public by default, however it's often useful to have private properties. These are not natively supported in JS but we can fake them.
Example 26: Faking public and private properties

Javascript supports inheritance, but it does so in a very different way - using prototypes. The key is the prototype property that all object constructors possess. How can a function have a property? Why, because functions are objects of course!
Introduction to prototypes

Let's plunge into our first example of prototypical inheritance, and understand the prototype keyword.
Example 46: Prototypical Inheritance In Action

An object's prototype can change on the fly - this is called Dynamic Prototyping, and this can lead to some pretty surprising effects in Javascript
Example 47: Dynamic Prototyping

A chain of inheritance can be implemented via prototypes - the Javascript interpreter will walk up the hierarchy until it can resolve a property.
Example 48: Inheritance hierarchy using chained prototypes

You can use the prototype keyword to override a property of all objects! Its a lot more powerful than simply overriding a property on a single object.
Example 49: Overriding properties using prototypes

Javascript has a prototype Object, from which all objects derive. In this sense its exactly like Java (of course the mechanism of inheritance is very different in Javascript)
Example 50: The base object as the ultimate prototype

Did you know that its possible to override properties even of built-in object types, such as strings? Do so with care!
Example 51: Overriding properties of built-in objects

JSON is a simple way to create an object from a string. Its full power lies in its simplicity, and in the fact that server-side code, which maybe in Java or C++, can communicate with a client in Javascript. This is huge.
Introduction To JSON

JSON can be used to create virtually anything - strings, numbers, booleans, empty objects, arrays.
Example 57: Simple JSON Use Cases

JSON can be used to create arbitrarily complex objects - see how.
Example 58: Creating meaningful objects with JSON
About the Instructor
Loony Corn
4.3 Average rating
5,450 Reviews
42,467 Students
75 Courses
An ex-Google, Stanford and Flipkart team

Loonycorn is us, Janani Ravi and Vitthal Srinivasan. Between us, we have studied at Stanford, been admitted to IIM Ahmedabad and have spent years  working in tech, in the Bay Area, New York, Singapore and Bangalore.

Janani: 7 years at Google (New York, Singapore); Studied at Stanford; also worked at Flipkart and Microsoft

Vitthal: Also Google (Singapore) and studied at Stanford; Flipkart, Credit Suisse and INSEAD too

We think we might have hit upon a neat way of teaching complicated tech courses in a funny, practical, engaging way, which is why we are so excited to be here on Udemy!

We hope you will try our offerings, and think you'll like them :-)