Monday , 25 September 2017
Home / Programming / JavaScript / Inheritance – Advanced JavaScript Tutorial
Inheritance
Inheritance

Inheritance – Advanced JavaScript Tutorial

Another advantage to using prototypes is that you can have inheritance in your scripts. What is inheritance? Well, first let me show you and then I’ll explain.

Clear your script and add this bit of code.

Alright, let’s break this done. We have 2 objects. One is BankAccount and the other is SavingsAccount. We add a method to the BankAccount object’s prototype that gets the status. Nothing new so far.

We then grab the SavingsAccount prototype and set it the object BankAccount.  Why do we do this? Well, by doing this, we now have access to the properties and methods of the BankAccount object. This includes the prototype as well. The SavingsAccount prototype has access to it. So, next we create an instance of the SavingsAccount object and then we access it’s method and properties.

As you can see, we try accessing the getStatus() method from the instance. However, the SavingsAccount object doesn’t have this method. So, JavaScript will then search for the prototype of SavingsAccount. Since the prototype of SavingsAccount is the BankAccount object, then JavaScript will eventually find this method deeply nested inside.

This is what’s called prototype chaining. JavaScript will start from the object and continue looking through the prototypes until the chain stops.

Can we still add methods and properties to the SavingsAccount prototype?

Yep, but you must do it after you chain the 2 objects. This is what inheritance is. Inheritance simply means an object inherits the properties and methods of another object. Prototype chaining is the most popular way to perform inheritance.

Why use inheritance?

As I’ve stated before, there will be times where you’ll be using libraries from other developers. You have the choice of directly going into the code and make adjustments when you need to, but that isn’t best practice. It’s mostly because  libraries are updated frequently. So you would end up having to make the same changes again and again.

However, by using inheritance, you can create a whole new object, but still gain the properties and methods of another object you might need.

Conclusion

Prototypes and inheritance are things you don’t need to use every time. Use them when you feel like it’s appropriate. For more information about inheritance, then go here.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain

About Jasko Koyn

Check Also

Try-Catch Statement

Try-catch Statement – Advanced JavaScript Tutorial

The try-catch statement is a unique way to handle errors. When errors occur, usually it …

2 comments

  1. To think, I was couefsnd a minute ago.
  2. Why do you name the callbacks? Isnt it ok with this.method = function {
    return(‘something’)
    }

Leave a Reply

Your email address will not be published. Required fields are marked *

ULTIMATE WORDPRESS DEVELOPMENT COURSE
Want to learn how to create your own custom WordPress plugins and themes? Check out my course!
Get 93% off my course. You'll also learn how to integrate WooCommerce and BuddyPress into your projects. This is a limited time offer
Yes, I would like to get 93% off your course!
No Thanks!
close-link