Typecasting and Coercion in JavaScript

Typecasting and Coercion in JavaScript

Image for postNo more that face.

Typecasting or coercion in simple term means to change the data type of a value to to another data type like for example, integer to a string or a string to a boolean etc.

There are two types of coercion, implicit and explicit. Implicit coercion is when there is automatic conversion of data type, where as When a developer expresses the intention to convert between types by writing the appropriate code, it?s called explicit type coercion (or type casting).

More on coercion

JavaScript only supports three type of conversion

  • to string
  • to boolean
  • to number

String Coercion

We can explicitly convert values to a string using the String() method . Also JavaScript does a implicit string coercion when used with the+ operator. The most trivial example would be concatenation.

val = 5String(val) //explicit coercion’10’ + val //105 not 15 and o/p is a String, implicit coercion

All other primitive values are converted to string naturally

String(true) // ‘true’String(false) // ‘false’String(0) // ‘0’String(-0.99) // ‘-0.99’String(null) // “null”String(undefined) // “undefined”

NOTE: Symbols can only be converted explicitly.

The type casting , String() method actually calls the toString() method. The only difference between type casting as a string and using toString() is that the type cast can produce a string for a null or undefined value without error as shown above.

Boolean Coercion

To explicitly convert values to boolean we use the Boolean() method. Implicit conversion is done happens in logical context i.e if else statements and by logical operators ( || && !) .The Boolean() type cast returns true when the value is a string with at least one character, a number other than 0, or an object ; it returns false when the value is an empty string, the number 0, undefined , or null .

Boolean(0) //falseBoolean(null) //falseBoolean(undefined) //falseBoolean(”) //falseBoolean(‘hi’) //trueBoolean(-1.2) //trueBoolean(new Date()) //trueimplicitBoolean(2 || ‘hello’) \trueBoolean(0 && new Date()) \falseif(2) { … } \ trueBoolean(0 == ‘0’) \ trueBoolean(0 === ‘0’) \ false

Numeric Coercion

To explicitly convert a value to a number we use the Number() method. The number method converts to both integer and float. Number() method calls two different methods, parseInt() and parseFloat() implicitly depending on the value.

Number(“5.6.7”) //NaNparseInt(“5.5.5”) //5ParseFloat(“5.5.5”) //5.5

The above code snippet helps in differentiating between Number(), parseInt()and parseFloat().

Number(false) // 0Number(true) // 1Number(null) // 0Number(undefined) // NaNNumber(NaN) //NaNNumber(“n”) // 0

Comparison, bitwise and arithmetic operator uses implicit number conversion except for the arithmetic operator +, if there is a string, then this operator uses String()method instead for Number() .

Number(“5″) + ” apple” // “5 apple”Number(“5”) + -3.22 // 1.7799999999999998Number(“5”) + “-3.22” // “5-3.22″4 > ‘5’ // false implicit coercion

That?s it, folks. I hope you find this interesting. Drop me your feedback! Thanks for reading.

18