JavaScript Data Type Conversion Tutorial

Richard Rembert - Jul 9 '22 - - Dev Community

Converting Data Types

As we’ve seen in the previous article, data types are classifications of a particular type of data. And it’s the type that determines which operations are able to be performed on the data. As we write programs, we’ll often need to convert our data types in order to perform tasks.

JavaScript is intelligent enough to convert some values for us, this is known as type coercion:
Converting Data Types
The above will work as our strings evaluate to numbers. However,
Converting Data Type
If we’re using the + operator, the strings will concatenate! So if we attempted to rely on type coercion in this case, we’d see unexpected results.

For this reason, when writing our own code, we should endeavor to convert data types ourselves — thus reducing potential errors.

Let's now take a look at how we can go about that!

Converting Values to Strings

Using the String() method, we can explicitly convert values to strings.

For example, let's take the number 100 and convert it to a string literal “100”.
Values to Strings
And let's convert a Boolean false into a string literal “false”.
String False
Within a variable, we can convert our value to a string like so:
String Name
We can check the data type of any value, using typeof, for example:
Typeof Name
Alternatively, we could do this more concisely like so:
Javascript Strings
Regardless of the method we choose, by using String() or n.toString(), we can explicitly convert our data into string values.

Converting Values to Numbers

When the time comes to convert values into numbers, we use the Number() method in a similar manner:
Coverting Values to Numbers
We’ve turned our string “2000” into the number 2000.

We could also convert a Boolean:
Convert a Boolean
It should be noted however, that we cannot convert our data type into a number if there are any characters or spaces within the string! If this were to be attempted a NaN (not a number) would be returned.
Convert to Nan

Converting Values to Booleans

We use Boolean() to convert strings and numbers into Boolean.

If any value is present, it will be converted to true:
Converting Values to Booleans
If the value is considered empty (0, an empty string (""), undefined, NaN or null), it will return false:
Booleans
Converting numbers and strings into Boolean values is a powerful way to start to introduce logic into our programming. For instance, we could detect a missed required field on an input form, if the Boolean returns false.

Summary

That's all for today!

In this article, we looked at how we can work with data types, using both type coercion as well as by implicitly performing our own type conversions.

In the next one, we'll dive right into working with strings!

Conclusion

If you liked this blog post, follow me on Twitter where I post daily about Tech related things!
Buy Me A Coffee If you enjoyed this article & would like to leave a tip — click here

🌎 Let's Connect

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .