Type Conversions in JavaScript

Type Conversions in JavaScript

In this article, we will learn about Type Conversions in JavaScript.

Type conversion is the process of converting data from one type to another in programming. For example: Converting String data to Number.

In JavaScript, there are two types of type conversions:

  • Implicit Conversion: It is a type conversion that is done automatically.
  • Explicit Conversion: It is a type conversion that is done manually.

Implicit Conversion in JavaScript

In some cases, JavaScript converts one data type to another automatically (to the right type) and so it is called Implicit conversion.

Implicit Conversion to String

// numeric string used with + gives string type
let answer;

answer = ‘5’ + 3;
console.log(answer) // “53”

answer = ‘7’ + true;
console.log(answer); // “7true”

answer = ‘5’ + null;
console.log(answer); // “5null”

answer = ‘7’ + undefined;
console.log(answer); // “7undefined”

Note: Before concatenating a number with a string, JavaScript converts the number to a string automatically.

Implicit Conversion to Number

// numeric string used with – , / , * results number type
let answer;

answer = ‘7’ – ‘3’;
console.log(answer); // 4

answer = ‘5’ – 4;
console.log(answer); // 1

answer = ‘7’ * 4;
onsole.log(answer); // 28

answer = ‘6’ / 3;
console.log(answer); // 2

Non-numeric String Results to NaN

// non-numeric string used with – , / , * results to NaN
let answer;

answer = ‘developers’ – ‘dome’;
console.log(answer); // NaN

answer = ‘4’ – ‘dd’;
console.log(answer); // NaN

Implicit Boolean Conversion to Number

// if boolean is used, true is 1, false is 0
let answer;

answer = ‘6’ – true;
console.log(answer ); // 5

answer = 7 + true;
console.log(answer); // 8

answer = 2 + false;
console.log(answer); // 2

Note: In JavaScript, 0 is false and all non-zero numbers are true. And the result of converting true to a number is always 1.

null Conversion to Number

// null is 0 when used with number
let answer;

answer = 7 + null;
console.log(answer); // 7

answer = 3 – null;
console.log(answer); // 3

undefined used with a number, boolean or null

// Arithmetic operation of undefined with number, boolean or null gives NaN
let answer;

answer = 5 + undefined;
console.log(answer); // NaN

answer = 5 – undefined;
console.log(answer); // NaN

answer = true + undefined;
console.log(answer); // NaN

answer = null + undefined;
console.log(answer); // NaN

Explicit Conversion in JavaScript

The explicit type conversion refers to a type conversion that is done manually. We can convert one data type to another according to our requirements.

Explicit type conversions are handled by built-in methods in JavaScript.

Here are a few examples of explicit conversion methods

Convert to a numerical value Explicitly

The number() can be used to convert numeric strings and boolean values to numbers. For example,

let answer;

// string to number
answer = Number(‘838’);
console.log(answer); // 838

answer = Number(‘584e-1’)
console.log(answer); // 58.4

// boolean to number
answer = Number(false);
console.log(answer); // 0

answer = Number(true);
console.log(answer); // 1

Null values and empty strings in JavaScript return 0. For example:

let answer;

answer = Number(null);
console.log(result); // 0

let answer = Number(‘ ‘)
console.log(answer); // 0

The result will be NaN if a string is an invalid number. For example:

let answer;

answer = Number(‘hello’);
console.log(answer); // NaN

answer = Number(undefined);
console.log(answer); // NaN

answer = Number(NaN);
console.log(answer); // NaN

Note: parseInt(), parseFloat(), the unary operator +, and Math.floor can also be used to generate numbers from strings ().For example:

let answer;

answer = parseInt(‘83.41’);
console.log(answer); // 83

answer = parseFloat(‘49.01’);
console.log(answer); // 49.01

answer = +’10.01′;
console.log(answer); // 10.01

answer = Math.floor(‘19.72’);
console.log(answer); // 19

Convert to String Explicitly

String() or toString() functions can be used to convert other data types to strings (). For example:

//number to string
let answer;

answer = String(324);
console.log(answer); // “324”

answer = String(2 + 4);
console.log(answer); // “6”

//other data types to string
answer = String(null);
console.log(answer); // “null”

answer = String(undefined);
console.log(answer); // “undefined”

answer = String(NaN);
console.log(answer); // “NaN”

answer = String(true);
console.log(answer); // “true”

answer = String(false);
console.log(answer); // “false”

// using toString()
answer = (324).toString();
console.log(answer); // “324”

answer = true.toString();
console.log(answer); // “true”

Note: String() converts null and undefined to string. However, When null is passed to toString(), it returns an error.

Convert to Boolean Explicitly

We can use boolean() to convert other data types to boolean.

Undefined, null, 0, NaN, and ” convert to false in JavaScript. For example:

let answer;

answer = Boolean(”);
console.log(answer); // false

answer = Boolean(0);
console.log(answer); // false

answer = Boolean(undefined);
console.log(answer); // false

answer = Boolean(null);
console.log(answer); // false

answer = Boolean(NaN);
console.log(answer); // false

True is returned for all other values. For example:

answer = Boolean(324);
console.log(answer); // true

answer = Boolean(‘hello’);
console.log(answer); // true

answer = Boolean(‘ ‘);
console.log(answer); // true

JavaScript Type Conversion Table

The table below shows how to convert various values in JavaScript to String, Number, and Boolean.

ValueString ConversionNumber ConversionBoolean Conversion
1“1”1true
0“0”0false
“1”“1”1true
“0”“0”0true
“ten”“ten”NaNtrue
true“true”1true
false“false”0false
null“null”0false
undefined“undefined”NaNfalse
“”0false
‘ ‘” “0true

That’s all about the Type Conversions in JavaScript.

You may like Operators in JavaScript.

Hope this article will guide you to recognize the Type Conversions in JavaScript that you needed and still if you have any problems or queries regarding this, post them in the comments section and we will be glad to assist you.

This Post Has One Comment

Leave a Reply