JavaScript Type Conversions

JavaScript is not strictly typed, it have a lot of flexibility around changing types of values from Object to primitive or from primitive to object. So as a JavaScript Developer, you don’t need to explicitly define types before performing any operation.

For example – If you add a number and string, then JavaScript would internally convert number to string. 10 + ” Computer Science Hub” // JavaScript internally converts number 10 to string 10

Here is the table listing all of possible type conversions which would JavaScript do internally –

ValueConverted to StringConverted to NumberConverted to BooleanConverted to Object
undefined“undefined”NaNfalsethrows TypeError
null“null”0falsethrows TypeError
true“true”1new Boolean(true)
false“false”0new Boolean(false)
“”0falsenew String(“”)
“1.2”1.2truenew String(“1.2”)
“one”NaNtruenew String(“one”)
NaN“NaN”falsenew Number(NaN)
Infinity“Infinity”truenew Number(Infinity)
-Infinity“-Infinity”truenew Number(-Infinity)
JavaScript Type Conversion Table

The general idea behind type conversion internally in JavaScript is just “if it can be converted then convert it”. Like “13” is a string but it could be converted to number so in a operation like “13” + 10 then answer would be 23(a number). As JavaScript have converted “13” string to number before executing the statement “13” + 10.

Primitive to Object Conversion JavaScript

Changing from primitive to object type seems quite simple, it’s just calling of certain functions, like “Computer Science Hub” string could be converted to an object by just saying new String(“Computer Science Hub”).

  • String primitive to String object => new String()
  • Number primitive to Number object => new Number()
  • Boolean primitive to Boolean object => new Boolean()

Object to Primitive Conversion JavaScript

Converting an object to a primitive type is quite tedious/tricky thing as object may be created from string/number/boolean, but then reverse engineering that process and coming up with exactly what’s object was created from is very difficult.

I personally don’t recommend doing Object to Primitive conversions frequently in JavaScript Code(Personally I would never do that). But in case you have to do that and you’re left with none other solutions, then be cautious.

Object to Boolean conversion in JavaScript

For checking whether an Object can be converted to Boolean, JavaScript just tests whether object contain some value or not. If it does then object is converted to true, otherwise to false.

  • Boolean(“Computer Science Hub”) // returns true
  • Boolean(“1002”) // returns true as well
  • Boolean(“”) //returns false

Object to String conversion in JavaScript

Almost every object in JavaScript have two things associated with it – a value and a primitive type. For converting an object to string internally JavaScript follows a specific procedure which is –

  1. If object has a toString() method, JavaScript calls it. If it returns a primitive vale(any of string, number, boolean) then it takes that value, change it to string and return it.
  2. If object don’t have a toString() method or this method doesn’t return any primitive value then JavaScript would invoke valueOf() method on the object. If valueOf() of method exists for that object, then JS will call it and change returned value to string and returns output as string.
  3. In all of other case, if JavaScript cannot get any primitive value using toString()/valueOf() then it would just throws a TypeError.

Object to Number conversion in JavaScript

For changing an object to number javaScript follows a procedure which is as following –

  1. If object has a valueOf() method that returns a primitve value, JavaScript converts that primitive value to a number and returns the result.
  2. Otherwise, if object has a toString() method that returns a primitive vale, JavaScript converts and returns the value.
  3. In all of other cases, JavaScript throws a TypeError.
Interesting Facts Which are based upon internal JavaScript Conversions
JavaScript converts an empty array to number 0 internally
An array having just one element may also convert to a number
Empty string converts to number 0
Array having single element always converts to string
Array containing multiple numbers converts to string of numbers
Internal Object Conversions in JavaScript(Some Facts to be known as JavaScript Developer)

Geeksforgeeks have an amazing article about this converting so check them out, if you’re interested in knowing more about this – Converting Object to Primitive in JavaScript.

Type Conversions before doing Arithmetic

As I have explained above JavaScript does some Object to Primitive type or vice-versa conversions internally. Owing to this some confusion arises about how these conversions would be done for performing arithmetical operations. Like what JavaScript would exactly do internally, If asked to add two strings.

All arithmetical operations +, -, X, /, <, > if have one operand as primitive, other as object then JavaScript would convert object to primitive type and after this would perform operation. If this conversion of object to primitive raises TypeError, then for whole of operation JavaScript will throw type error.

Testing Equality of Object and Primitive in JavaScript

Comparing objects with primitives could be quite confusing as JavaScript is doing some internal magic of changing object to primitive or vice-versa. That’s why it becomes quite difficult to debug JavaScript code, like if you have Control Flow statements(if…. else..) and you go into a specific code block then it could be quite problematic.

  • null == undefined //These two values treated as same by JavaScript
  • “0” == 0 //Would be same
  • “Computer Science Hub” == true //this would also be same

Moreover, if your interested in knowing more about Comparing objects then check out Dmitri’s amazing article list all possible ways how objects can be compared in JavaScript – Comparing Objects Dimitri’s Article.

  • Reference Equality
  • Manual Comparison
  • Shallow Equality
  • Deep Equality
  • Summary

Explicit Conversions in JavaScript

As I’ve already talked above, JavaScript is quite good in understanding types and just flipping these around for different entities in the program and you don’t need to worry much about having to tell JavaScript to treat something as a string/number or Boolean.

But rather it’s always a best practice to have at least some Explicit type conversions, if it seems weird or you just want to keep a track of types of entities/variables in code.

JavaScript functions Number(), String(), Boolean() and Object() could be used for doing type conversions, these also with new keyword can be used for creating Wrapper Objects(If you don’t know about Wrapper then see Wrapper Object in JavaScript article on this website).

  • Number(“10304”) // converts string 10304 to number 10304
  • String(true) // converts string true to Boolean true
  • Object(1002) // converts object 1002 to number 1002

Not only JavaScript handles Type Conversions for different types of objects, rather it do conversions for performing arithmetical operations as well. Like if you do x + “” statement JavaScript will convert “” an empty object to an empty string and then perform arthimatical operation.

  • “Comp” + 10 // JavaScript will convert 10 to string first and then do addition and would return Comp10

Conclusion

JavaScript takes care of most type conversions, internally so as Developer you need not to worry much. But be cautious about this as well, because in some cases this auto type conversion could lead to some TypeErrors.

If in case your learning JavaScript Programming Language, then I’ve put together lot of articles about it on this website. You can check these out here – JavaScript Computer Science Hub.

Moreover if something is not clearer to you from this article and you want to ask a question, then please comment down below and I would try to reply as soon as possible. Happy Coding!!!!

Leave a Comment