Learning Object-Oriented JavaScript

Acquire advanced JavaScript skills and create complex and reusable applications
4.4 (44 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.
496 students enrolled
Take This Course
  • Lectures 23
  • Length 3 hours
  • Skill Level Intermediate Level
  • Languages English, captions
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works


Find online courses made by experts from around the world.


Take your courses with you and learn anywhere, anytime.


Learn and practice real-world skills and achieve your goals.

About This Course

Published 2/2015 English Closed captions available

Course Description

This course will help you change some common coding practices and empower you by giving you the tools you need for more efficient development.

You start with building a simple digital clock and use this as the case sample for the course. Then, we begin exploring the object-oriented tools in JavaScript such as the constructor, scope, methods, and properties. Next, we dive even deeper as we explore the wonderful world of prototypes, static methods and properties, and namespaces. We then turn our attention to inheritance and finally end the course with a section to dedicated events and callbacks. As we explore what they are and how to use them, we complete our sample by creating a fully usable alarm clock.

With this course, you will be an expert in OOP with JavaScript in under 3 hours!

About the Author

Ben Fhala discovered his passion for data visualization six years ago while he was working at Parsons in New York, in their data visualization department, PIIM. He is the owner of the online video training school, and an Adobe ACP. He enjoys spending most of his time learning and teaching and has a love for visual programming and visualization in general. Ben has had the honor of developing applications for members of the US Congress, Prime Ministers, and Presidents around the world.

He has built many interactive experiences for companies such as Target, AT & T, Crayola, Marriott, Neutrogena, and Nokia. He has technically directed many award-winning projects and has been part of teams that have won three Agency of the Year awards. Among Ben's publications are Packt’s HTML5 Graphing and Data Visualization Cookbook.

What are the requirements?

  • Get object-oriented with this course, which cuts down long debates on theory and takes you on a journey using hands-on tools, features, and ways to improve your productivity using OOP techniques.

What am I going to get from this course?

  • Customize the built-in objects to create a digital clock
  • Explore the world of prototypes to leverage the functionality of objects
  • Dive into the world of objects, which can talk and see each other through events and callbacks
  • Shed the traditional methods and work with constructors and scopes
  • Make your code more efficient and productive with the use of methods, properties, and inheritance

Who is the target audience?

  • This course is intended for JavaScript developers as an easy gateway into the world OOP by presenting a simple project and then enhancing it through object-oriented mythologies.

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.


Section 1: Creating a Clock

This is our setup lesson to start working in JavaScript.


Before we can manipulate any data in our document, we need to know whether it's completely loaded.


This video provides a quick revision of the basic theory of JavaScript.


Unfortunately, different brand servers react differently to our JavaScript. We will see how we can work around it.


Our clock is almost ready; we just need to format it and get it to tick. That's exactly what we will do in this video.

Section 2: Object-Oriented Programming

The whole point of object-oriented programming is to enable you to cluster concepts into buckets.


As a traditional developer, there was no relevance to relativism. One of the biggest advantages of working in an object-oriented mindset is the concept of relative relationships.


In the previous video, we created our first object that leverages the built-in object. The next step is the process to actually create a complete standalone object.


One of the biggest features of object oriented programming is the ease of reusing code. Once you complete building an object, you don't even need to remember or know how it actually works. All you need to do is remember how to work with it.

Section 3: Prototype

So far, everything that we did worked perfectly as long as we weren't planning on expanding our object to be able to work with other objects.


We don't need to learn new techniques to learn another way to leverage our new knowledge of the prototype. Every built-in object has a prototype as well, and we can automatically add features to any object, including built-in objects, by expanding and adding more methods into the prototype.


In the previous sections, we focused on the functions and properties that belong to objects, but there are different types of properties and methods that belong to the actual constructor.


As you start building your own objects, you're going to encounter a problem at some point of time. A common problem occurs when you create a function name that has already been created by someone else.

Section 4: Inheritance

Every function in JavaScript, just by being a function, is a type of object (a Function Object), and this means that every function has built-in methods.


In the previous sections, we've been creating objects and making them more dynamic. Apart from expanding features of other objects with object-oriented programming in JavaScript, we can tell an object to lean on another object for methods and properties.


The Object.create message that we used in the previous section to create an inheritance chain between our objects is a modern update to JavaScript and does not exist in older versions of it.


Now that we have object-oriented inherited objects, it’s time to update a specific method or change it while keeping all the rest.


In the course of the previous sections, we've been expanding our capabilities as object-oriented programmers with inheritance. It's time for us to practice our new skills.

Section 5: Events and Callbacks

One of the new cool features in HTML5 is the capability of automatically turning HTML elements to become live editable content in the browser.


It's time for us to move into events, a completely new topic and capability in object-oriented programming.


In the previous video, we learned how to listen to events. In this section, we will continue to work with those events.


Not every object has a built-in event dispatcher, and the most common way to create a notifier mechanism in JavaScript is by using callbacks.


Now that we have reached the end of the course, let’s see how we can cut down on the number of intervals in our clock.

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Packt Publishing, Tech Knowledge in Motion

Packt has been committed to developer learning since 2004. A lot has changed in software since then - but Packt has remained responsive to these changes, continuing to look forward at the trends and tools defining the way we work and live. And how to put them to work.

With an extensive library of content - more than 4000 books and video courses -Packt's mission is to help developers stay relevant in a rapidly changing world. From new web frameworks and programming languages, to cutting edge data analytics, and DevOps, Packt takes software professionals in every field to what's important to them now.

From skills that will help you to develop and future proof your career to immediate solutions to every day tech challenges, Packt is a go-to resource to make you a better, smarter developer.

Packt Udemy courses continue this tradition, bringing you comprehensive yet concise video courses straight from the experts.

Ready to start learning?
Take This Course