JavaScript data type conversion

Data type conversion is a process in JavaScript where values are converted from one type to another. This can be done automatically, where JavaScript handles the conversion by itself or manually, where the programmer converts the data types using operators and functions.
It is crucial that programmers understand data types and how they can be converted. This will help them to avoid unforeseen errors, and ensure that codes are easier to maintain and are more reliable.

Data types in JavaScript

There are two major data types in JavaScript. They are;

1. Primitive data types and;
   I. Number
   II. String
   III. Boolean
   IV. Undefined
   V. Null
   VI. Symbol
   VII. bigInt

2. Non-primitive or object types
   I. Objects
   II. Arrays
   III. Functions

What is data type conversion?

Data type conversion means changing the data type of a JavaScript value. There are two ways of changing data types in JavaScript; one way is when the programmer manually converts the data type of a value. This is also known as type casting or explicit data conversion. The second approach to data type conversion is performed automatically by the compiler, usually done when operations or comparisons involves more than one data type. This is known as type coercion or implicit data conversion.

Explicit data conversion:

Sometimes, to avoid unexpected result or to ensure that the outcome of a program is outputted in the correct data type, programmers can manually convert data from one type to another in JavaScript.

Converting values to number:

To convert a data type to number,
Use Number() method.
Eg.

Let example1 = “456”;
Number(example1); // 456

The Number() method converts numeric strings to the number in the string.

let example2 = "i am a number";
Number(example2) // NaN 

The Number() method converts text strings to NaN (not a number).

let example3 = true; 
Number(example3)  //1

let example4 = false; 
Number(example4)  //0

let example5 = null;
Number(example5);  // 0
let example6;
typeof example6 //   'undefined'
Number(example6) // NaN

The Number() method converts Booleans to 1 and 0. 1 for true, and 0 for false. It also converts null to 0 and undefined to NaN.
Other methods for number type conversions include
parseInt(); returns an integer.
parseFloat(); returns a floating number.

Converting values to string:

To convert data types to string, use the String() or toString() methods.
Examples:

Let example1 = 1234;
String(example1) // ‘1234’
Let example2 = true;
example2.toString() // ‘true’
let example3;
String(example3)  // “undefined”
let example = 3+4;
String(example)
'7'
example
7

Parsing the values into the String() function converts the outcome into a string.

Converting values to Boolean:

Boolean represent true or false values. In converting other data types to Boolean, these are some of the rules.
Numbers other than 0 converts to true;

Boolean(-10) // true
Boolean(10) //true

Number 0 converts to false;

Boolean(0)  // false

Undefined values convert to false;

Let x;
Boolean(x); // false

Null converts to false;

Boolean(null)  // false

Empty strings converts to false;

Boolean("") // false

Strings with numbers or text inside converts to true.

Boolean("0")  // true
Boolean("text")  // true

Implicit Data Conversion.

JavaScript is a dynamically typed language. This means that the language does not require programmers to specify data types as variables are declared. Instead, JavaScript automatically determines the data types of the values. A proper understanding of how JavaScript does this is important to programmers for writing maintainable and reliable code. Some of the applicable rules in JavaScript type coercion include;
• Plus sign operator (+) combined with a string is treated as a concatenation sign.

10 + "10"  //   “1010”

10 + "example"   //  '10example'

true + " example"  //    'true example'

• Combining numbers with operators (-, *, /, %) will convert the outcome to number.

10 - "10"    // 0
10 – true   // 9

10 * false // 0

10/undefined   // NaN

10-null       // 10

10 % "10"  // 0

10 % "sample text"  // NaN

10 - "sample text" // NaN

• Logical operations (&&, ||, !), converts values to Boolean based on their truthy or falsy equivalence.

In logical operations (&&, ||, !), the conversion follows a truthy and falsy hierarchy:
a) Numbers apart from 0, non-empty strings, and objects are considered truthy.
b) Zero, empty strings, null, undefined, NaN, and false are considered falsy.
c) Values are implicitly converted based on this hierarchy (e.g., "" || true evaluates to true).

conclusion

Programmers should take note of how JavaScript converts data implicitly so as to avoid surprises should the outcomes present itself in your code. Explicit conversion methods should be used to ascertain what data types the outcomes will be.
Programmers should also note that when comparing values, strict equality operator ( === ) should be their preference. === checks for both equality of the value and the data types. Whereas with == operator, only values are checked. Hence, “10” == 10 will evaluate as true but if the data types were checked, they are not equal as one is a string and the other is a number.