paint-brush
Learning Duck Typing in Javascriptby@mac
1,567 reads
1,567 reads

Learning Duck Typing in Javascript

by Mac Wasilewski
Mac Wasilewski HackerNoon profile picture

Mac Wasilewski

@mac

During the day a developer. A husband and dad at...

March 22nd, 2021
Read on Terminal Reader
Read this story in a terminal
Print this story
Read this story w/o Javascript
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

This article dives into learning duck typing in Javascript and examples of polymorphism.

People Mentioned

Mention Thumbnail

Ravi Singh

@raviksingh

Company Mentioned

Mention Thumbnail
Mozilla
featured image - Learning Duck Typing in Javascript
1x
Read by Dr. One voice-avatar

Listen to this story

Mac Wasilewski HackerNoon profile picture
Mac Wasilewski

Mac Wasilewski

@mac

During the day a developer. A husband and dad at night.

About @mac
LEARN MORE ABOUT @MAC'S
EXPERTISE AND PLACE ON THE INTERNET.

Recently I started thinking about OOP in Javascript. Having been heavily involved in functional React for the last 2.5 years it wasn't easy.

You know basic OOP concepts are: encapsulation, inheritance, abstraction, and polymorphism. I have been looking at a good example of polymorphism in Javascript.

In dynamic languages, it exists in the form of duck typing. Duck what?

If something quacks like a duck, it is a duck.

Polymorphism is when a different function gets called depending on the type of objects on which that function is executed. So is it a duck? Call the duck() function! Is it a dog? Call the dog() one!

I'm pretty sure that you use any of the above on a daily basis. Have you ever used Array.map, Array.filter. Sure you did! But to be able to call those methods and object must be:

"an iterable, an object must implement the @@iterator method, meaning that the object (or one of the objects up its prototype chain) must have a property with a @@iterator key which is available via constant Symbol.iterator."

Source: Mozilla

Translating the above duck typing explanation into this example if an object implements an iterable, it must be iterable! So call the iterator methods!

And bam! We proved that polymorphism exists in dynamic languages!

image

What about creating our own example?

function Cat (name) {
  this.name = name;
}

Cat.prototype.sound = function() {
  console.log('Miau')
}

function Dog (name) {
  this.name = name;
}

Dog.prototype.sound = function() {
  console.log('Woof')
}

function makeSound(soundMaker) {
  soundMaker.sound()
}

const purr = new Cat('Purr');
const pluto = new Dog('Pluto');

makeSound(purr)
makeSound(pluto)

In the above, we have two different objects, but both implement a sound method and a makeSound function. And now we are back to our initial definition: Polymorphism is when a different function will get called depending on the type of objects on which that function is executed. So exactly what happens in our silly example above.

Looking for something more serious? Imagine you have several types of users, and each of them needs a location address generated based on the type. Perhaps the developers are in San Francisco, the lawyers in Boston, etc. So each object would implement an assignOfficeAddress method which would store a different address in the database.

Now on new user creation, you would just call for example a createUser function which would call assignOfficeAddress() without having to care which user you are creating.

How does it help? The code is clearer, there are fewer if, else, or switch statements but the most important of all - creating a new type of user is just creating a new object and implementing a new assignOfficeAddress method.

The createUser stays the same and you do not have to worry about updating the switch or if/else anymore, just call the createUser which will correctly call the correct method.

Lead Photo by Ravi Singh on Unsplash

L O A D I N G
. . . comments & more!

About Author

Mac Wasilewski HackerNoon profile picture
Mac Wasilewski@mac
During the day a developer. A husband and dad at night.

TOPICS

THIS ARTICLE WAS FEATURED IN...

Permanent on Arweave
Read on Terminal Reader
Read this story in a terminal
 Terminal
Read this story w/o Javascript
Read this story w/o Javascript
 Lite
Scientificprogrammer
Learnrepo
Joyk
Scien
Hashnode
Learnrepo
Learnrepo

Mentioned in this story

companies
profiles
X REMOVE AD