Implicit coercion In Javascript

Type coercion is the process of converting value from one type to another.

When we are using

Number('89') or String(55)

in order to convert a type into another type, we are making an Explicit coercion since we are converting the value by ourselves.

But in some case, JS Engine need to convert variable in order to execute some operation.

For example when we use == (equal operator), if both value have not the same type, it will need to use an Implicit coercion (JS engine will convert value by itself).

⚠️ Be careful, don't be mistaken with === (strict Equality, coercion is not apply since we are comparing the type before the value) !

The question is how it handle this process in this case ?

55 == '55'

// or

'toto' == { name: 'toto' }

I give you a cheat list about this process with explained exemple !

It’s the general/easy way to understand the process but for Object vs any comparaison, I summarized a few about the process.

I will explained afterward this process, but If you just want to understand the global logic, you don't need this.

Example

String vs Number

// 1)

'toto' == 24

// Convert string into number so 

Number('toto') == 24

// But we got NaN for this conversion

NaN == 24 // false !

Object vs string

// 2)

'hello' == {}

// Use .toString() with object vs any

'hello' == {}.toString()

// So we got

'hello' == '[object Object]' // false

Object vs boolean

// 3)

true == {}

// Use .toString() with object vs any

true == {}.toString()

true == '[object Object]' // number vs string

// convert boolean into number Number (true) = 1

1 == '[object Object]'

// We have String vs Number,
// Almost done ! We just need to convert string into number now 

1 == Number('[object Object]')

// But

1 == NaN // false !

Advanced part

For object vs any comparaison, it’s a little more complicated, in fact we need to divide this operation in 2 kinds.

For date object we need to use object.toString(), if the value return is primitive, compare it, else use object.valueOf(), if this values is not a primitive, throw a TypeError, else return value

For other object* we need to use object.valueOf(), if the value return is primitive, compare it, else use object.toString(), if this values is not a primitive, throw a TypeError, else return value

In general you will only use .toString() for object vs any, but now you can more understand the coercion handling !

---

I hope you like this reading!

🎁 You can get my new book Underrated skills in javascript, make the difference for FREE if you follow me on Twitter and MP me 😁

Or get it HERE

🎁 MY NEWSLETTER

☕️ You can SUPPORT MY WORKS 🙏

🏃‍♂️ You can follow me on 👇

🕊 Twitter : https://twitter.com/code__oz

👨‍💻 Github: https://github.com/Code-Oz

And you can mark 🔖 this article!

Comments

[Adam Crockett 🌀]

Implicit things make me feel so unsafe. It's a popular view that to be explicit is to be safe, in control and most importantly accountable. So in other words, I'd rather tell JavaScript to be explicit, find those bugs explicitly and type an extra =

Is that just me?

[Code Oz]

No don't worry ;D, use == operator is not really good in fact, we always advice to use === operator :D