Alternative patterns in JS: OLOO style
This is my fourth and last post in the series of “JS: Leave the classes to those other languages”. If you haven’t checked out the first three posts, you can read them on JS: Leave the classes to those other languages, JS Prototype chain mechanism and Pseudoclasses and Prototypal Inheritance in JS.
Delegation Oriented Design
Ok, we don’t want to work with classes in JS but what’s the alternative?
How can I make a considerate and efficient use of the prototype chain to work with objects?
Prototypes represent a fundamentally different design pattern from classes and we need to change our thinking from the class/inheritance design pattern to the behaviour delegation design pattern.
We observed before that in the prototype chain mechanism if an object does not know how to retrieve a property it tries to ask to the object above in the chain.
We use the OLOO style pattern here to embrace delegation.
What is OLOO?
OLOO just stands for objects-linked-to-other-objects.
It’s a style pattern which embraces delegation oriented design and the nature of JS in general. One of the thing I like most about OLOO is the fact we can completely get rid of the confusing
No more need to use function as a constructor to create objects;
Object.create() method will be our hero here.
Let’s have a look at how we can implement the same Student / Person relation using OLOO.
Here is a mental map of the prototype chain generated by the code above.
You can tell at first glance that using OLOO cleans the “mental mess” up.
There are no brainfuls here. Thumbs up for OLOO!
Let’s comment the code.
We create an object
Person with a couple of methods using the literal form and JS automatically links the
Person object to
Object.prototype in the chain.
After we create an object
Student linked to
Person using the
Student will be able to use all the methods which are in the
We extend the
Student object with some methods and then we are ready to add objects which need to use all the
Student methods to the chain.
So I can add a
giamir object writing:
In case I want to add another object
charlotte for example I can simply write:
I can have lot of “students” all be able to use the same
Student methods and have different
school properties at the same time.
If you grasped the OLOO style pattern and you want to have a look at a slightly more complicated exemplar you can have a look at my Airport Challenge KATA solved using OLOO.
This series of articles aimed to answer essentially 2 questions:
- Why is so complicated to work with pseudoclasses?
Do we really need to fake classes in JS?
Because it does not embrace the language. It’s like having a dolby surround system and listen mono. Actually it’s even worst because to “listen mono” (use classes) you need to use your modern system (JS) in an unnatural way (use constructors to simulate classes).
- NO, JS is a very powerful programming language and take a “faking classes” approach limits your code. You completely miss what makes JS so cool and interesting.
These are just my answers; I would like to hear yours.
Drop a comment below!
This topic was also the subject of the speech I presented as part of my Thoughtworks application process. Slides and video are available at the following links.
If you would like to expand upon these aspects of JS here is a list of useful resources: