Javascript Type Conversion in 3 mins

I thought it might be cool to share with you how Javascript converts its primitive data types.
This is a high level overview of Javascript Type Conversion. After reading this blog you will have a better understanding of how javascript converts its data types

Type Conversion

• Converting one data type to another ( Number to a String or String to a Number )

In Javascript there are two types of type conversion that happens, implicit conversion and explicit conversion. Let's go over both type of conversions.

Implicit Conversion

• Javascript automatically converts data types without us telling it to.
• Preforming arithmetic operations on two different data types with cause Javascript to convert the data types so it returns a valid value.
• When using the + operator with a string and another data type, Javascript will convert both data types into strings and give a return value of a string.

console.log(5 + "5"); => "55"
console.log(true + "false"); => "truefalse"

• When using the | - | * | / | % | operators Javascript will try to convert both data types into numbers

console.log(1 * "2"); => 2
console.log(5 * "5"); => 25

• If a data type cant be converted into a number, Javascript will return NaN (Not A Number) as a return value

console.log(1 * "true"); => NaN
console.log(0 / false); => NaN
console.log(true % "false"); => NaN
console.log(1 * undefined); => NaN

• When the boolean value of true is converted into a number, it has the value of 1

console.log(0 + true); => 1

• The boolean value false is converted into a number, it has the value of 0

console.log(1 * false); => 0
console.log("14", true + false); => 1

• null also has the value of 0

console.log(1 * null); => 0

• Any number divided by 0 equals infinity

console.log(12 / false); => Infinity
console.log(true / false); => Infinity

• Using equality operators will cause Javascript to convert data types
• The == equals to operator compares both values and converts both data types into numbers
• The === strictly equals to operator compares both values but does not convert data types

console.log(7 == "7"); => true
console.log(7 == "8"); => false
console.log(7 === 7); => true
console.log(7 === "7"); => false
console.log(7 === "8"); => false
console.log("true" == true); => false
console.log("true" === true); => false
console.log(true == 1); => true
console.log(true === 1); => false
console.log(null == undefined); => true
console.log(null === undefined); =>false

Explicit Conversion

• Manually Converting Data Types
• The Number() method converts string and boolean values into numbers. If a string contains any text, javascript will return NaN

console.log(Number("")); => 0
console.log(Number("Halo 3")); => NaN
console.log(Number("5")); => 5
console.log(Number(true)); => 1
console.log(Number(false)); => 0

• The parseInt() method converts string values into whole numbers. parseInt() is a string method. It returns an error when used with other data types. If a string holds text and numbers, we can extract the numbers in a string only if the number is at the beginning of the string. If the number is not at the beginning of the string, we get a return value of NaN NotaNumber

console.log(parseInt("12")); => 12
console.log(parseInt("12.5")); => 12
console.log(parseInt(true)); => NaN
console.log(parseInt("true")); => NaN
console.log(parseInt("true12")); => NaN
console.log(parseInt("12true12")); => 12
console.log(parseInt(null)); => NaN

• The parseFloat() method is similar to the parseInt() method except it is used to convert strings that hold decimal numbers into floats.

console.log(parseFloat("12.5")); => 12.5
console.log(parseFloat("2.5Hello")); => 2.5
console.log(parseFloat("2.5 Hello")); => 2.5
console.log(parseFloat("Hello2.5")); => NaN
console.log(parseFloat("Hello 2.5")); => NaN

• The String() method and .toString() method converts primitive data types into strings

console.log(String(12)); => "12"
console.log(String(true)); => "true"
console.log(String(3.41)); => "3.14"
console.log((88).toString()); => "88"
console.log(true.toString()); => "true"
console.log((22.1).toString()); => "22.1"
console.log((12345678).toString()); => "12345678"

• The Boolean() method converts primitive data types into boolean values
• Positive & Negative numbers have a true value
• 0 and empty strings have a false value
• Strings with text or numbers have true value
• null & undefined has a false value

console.log(Boolean(3)); => true
console.log(Boolean(0)); => false
console.log(Boolean(-1)); => true
console.log(Boolean(-10)); => true
console.log(Boolean("")); => false
console.log(Boolean("ghjk")); => true
console.log(Boolean("56789")); => true
console.log(Boolean(null)); => false
console.log(Boolean(undefined)); => false