JAVASCRIPT OOP /// CLASSES /// INHERITANCE /// EXTENDS /// SUPER /// PROTOTYPES /// JAVASCRIPT OOP /// CLASSES /// INHERITANCE /// EXTENDS /// SUPER ///

JavaScript Inheritance

Learn how to share and expand functionality across classes using 'extends' and the 'super' keyword. DRY up your codebase.

inheritance.js
1 / 9
12345678910
{ Inherit }

Tutor:In JavaScript, classes can inherit properties and methods from other classes. This promotes code reusability and creates a hierarchical relationship.

Skill Matrix

UNLOCK NODES BY MASTERING INHERITANCE.

Concept: Class

A class acts as a template for creating objects. Use the class keyword to declare it.

System Check

Which keyword defines an object blueprint in ES6?

Community Holo-Net

Share Your Architectures

ACTIVE

Built a complex class hierarchy? Share your Object-Oriented JS code snippets.

Support Us

JavaScript Inheritance

Author

Pascual Vila

Fullstack Engineer // Code Syllabus

Inheritance allows us to define a class that takes all the functionality from a parent class and allows us to add more. It is a core principle of Object-Oriented Programming (OOP), promoting DRY (Don't Repeat Yourself) code.

The `extends` Keyword

To create a class inheritance, use the extends keyword. A class created with a class inheritance inherits all the methods from another class.

The `super()` Method

The super() method refers to the parent class. By calling the super() method in the constructor method, we call the parent's constructor method and gets access to the parent's properties and methods. Important: You must call super() before you can use this in the subclass constructor.

Method Overriding

If a child class has a method with the exact same name as a method in its parent class, the child's method takes precedence when called on instances of the child class. This is known as overriding.

Prototypal Inheritance Under The Hood+

Remember that ES6 classes are mostly syntactic sugar over JavaScript's existing prototype-based inheritance. The extends keyword sets up the prototype chain automatically. Dog.prototype inherits from Animal.prototype.

Inheritance Glossary

Class

A blueprint for creating objects, providing initial values for state (member variables) and implementations of behavior (member functions).

snippet.js

Inheritance

A mechanism wherein a new class is derived from an existing class, inheriting its attributes and methods.

snippet.js

extends

Keyword used in class declarations to create a class that is a child of another class.

snippet.js

super

Keyword used to access and call functions on an object's parent.

snippet.js

Method Overriding

When a child class provides a specific implementation of a method already defined in its parent class.

snippet.js

Subclass / Superclass

Subclass is the child class that inherits. Superclass is the parent class being inherited from.

snippet.js