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.
Programmers must 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 more reliable.
Data types in JavaScript
There are two major data types in JavaScript. They are;
- Primitive data types and;
I. Number
II. String
III. Boolean
IV. Undefined
V. Null
VI. Symbol
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 results 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.
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 convert to true.
Boolean("0") // true
Boolean("text") // true
Implicit Data Conversion.
JavaScript is a dynamically typed language. This means 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;
- The 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 (&&, ||, !), convert values to Boolean based on their truthy or falsy equivalence.
In logical operations (&&, ||, !), the conversion follows a truthy and falsy hierarchy:
Numbers apart from 0, non-empty strings, and objects are considered truthy.
Zero, empty strings, null, undefined, NaN, and false are considered falsy.
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 to avoid surprises should the outcomes present themselves 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 the equality of the value and the data types. Whereas with the == operator, only values are checked. Hence, “10” == 10 will be evaluated as true but if the data types were checked, they are not equal, as one is a string and the other is a number.