There are no classes in JavaScript

If you’ve started learning JavaScript in the last few years, you probably think that the headline is patently wrong and that the author is either clueless or full of it. On the other hand, if you, like me, started your JS path in the mid-to-late 90s, when mouseover effects were the state of its art, you probably fall into one of two categories: either you’re nodding knowingly, or you’re shaking your head muttering something about moving into the modern era. Let’s investigate.

Since ES6/ES2015 there is clearly a class keyword, with a number of friends, so what do I mean when I say that “there are no classes in JavaScript”? Well, don’t take my word for it – let’s see what MDN has to say on the matter:

JavaScript classes, introduced in ECMAScript 2015, are primarily syntactical sugar over JavaScript's existing prototype-based inheritance. The class syntax does not introduce a new object-oriented inheritance model to JavaScript.

In fact, let’s not take MDN’s word for it either. This is from the official ECMAScript specification:

Even though ECMAScript includes syntax for class definitions, ECMAScript objects are not fundamentally class-based such as those in C++, Smalltalk, or Java. Instead objects may be created in various ways including via a literal notation or via constructors which create objects and then execute code that initializes all or part of them by assigning initial values to their properties. Each constructor is a function that has a property named prototype that is used to implement prototype-based inheritance and shared properties.

Despite the readily apparent fact that the prototype system is what the language is actually based on, many JavaScript programmers simply are not aware of it, which is a really deplorable state of affairs by any measure. It was true before the introduction of class, and it is even more true after. Two decades hence (!), Douglas Crockford’s oft-repeated quote unfortunately still holds: JavaScript is the world’s most misunderstood programming language.

Before we go any further, I should make a note on the use of the term “class” in this article series. While the general, more narrow concept of a class as such exists in many programming languages, the term is more often than not understood in the wider sense that is used in statically typed class-oriented languages such as Java, C# or C++, which includes related OOP concepts like inheritance, polymorphism and nominal types. More importantly, the introduction of class-with-extends syntax in ES6 was both modelled on and motivated by familiarity to such languages, or at the very least is generally perceived as such, and it is from that perspective that these articles are written.

The subject at hand is a complex one and requires delving deep into various technical concepts, with many working examples to illustrate what is actually going on. It has therefore been broken up into several parts:

Part 1: Prototypes vs. classes

If you find yourself among the prototype-wary crowd, here’s a crash course. Just what are prototypes, anyway, and how does prototypal object-oriented programming compare to class-based OOP – particularly in the context of JavaScript? Let's find out.

Part 2: ES6 classes aren't what you think they are

What does the class keyword mean in JavaScript? More importantly, what does it not mean? Here we investigate how ES6 classes actually work under the hood, and why the answer will probably surprise you in a number of risk-laden ways.

Part 3: Should class be considered harmful in JavaScript?

We end the series by looking at how too narrow a view of the JavaScript language through the prism of class-based thinking, and the class syntax in particular, is problematic – and why this matters. After all, there are no classes in JavaScript...