Type Conversion in JavaScript

Type Conversion in JavaScript means converting one data type to another.

JavaScript data type or variables can be converted into a different variable and/or different data type by the following ways:

Using JavaScript methods
By JavaScript itself (automatically)

Converting Numbers to Strings

Using JavaScript method

The JavaScript function String() can convert numbers into strings.

String() can take any numbers, literals, variables, or expressions. Consider the examples given below:

int x=77; 

String(x) //returns string from integer

String(143) // converts a string from a number literal 143 

String(100 + 43)  //returns string from a number expression

int x=77;

String(x) //returns string from integer

String(143) // converts a string from a number literal 143

String(100 + 43) //returns string from a number expression

The Number method toString() also does the same.

Automatically by JavaScript

Consider the following example:

alert( "10" / "2" );    // returns 5 i.e., strings are converted to numbers

1	alert( "10" / "2" ); // returns 5 i.e., strings are converted to numbers

Converting Booleans to Strings

The JavaScript global function String() can also convert booleans into strings.

String(false)        // returns string "false"

String(true)         // returns the string "true"

String(false) // returns string "false"

String(true) // returns the string "true"

The Boolean method toString() acts similarly.

false.toString()     // returns "false" string

true.toString()      // returns "true" string

false.toString() // returns "false" string

true.toString() // returns "true" string

Converting Dates to Strings

In JavaScript, you can convert dates to strings using the toString() method or the toDateString() method. Both methods return a string representation of the date.

Here is an example:

const today = new Date(); // create a new Date object with the current date and time
const dateString = today.toString(); // convert the date to a string using the toString() method
const dateOnlyString = today.toDateString(); // convert the date to a string with only the date using the toDateString() method
console.log(dateString); // output: "Wed Mar 09 2023 13:49:23 GMT-0500 (Eastern Standard Time)"
console.log(dateOnlyString); // output: "Wed Mar 09 2023"

const today = new Date(); // create a new Date object with the current date and time

const dateString = today.toString(); // convert the date to a string using the toString() method

const dateOnlyString = today.toDateString(); // convert the date to a string with only the date using the toDateString() method

console.log(dateString); // output: "Wed Mar 09 2023 13:49:23 GMT-0500 (Eastern Standard Time)"

console.log(dateOnlyString); // output: "Wed Mar 09 2023"

You can also use the toLocaleString() method or toLocaleDateString() method to format the date string according to the user’s locale settings.

Here is an example:

const today = new Date(); // create a new Date object with the current date and time
const options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }; // define the formatting options
const dateString = today.toLocaleString('en-US', options); // convert the date to a string with the specified formatting options
const dateOnlyString = today.toLocaleDateString('en-US', options); // convert the date to a string with only the date and the specified formatting options
console.log(dateString); // output: "Wednesday, March 9, 2023"
console.log(dateOnlyString); // output: "Wednesday, March 9, 2023"

const today = new Date(); // create a new Date object with the current date and time

const options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }; // define the formatting options

const dateString = today.toLocaleString('en-US', options); // convert the date to a string with the specified formatting options

const dateOnlyString = today.toLocaleDateString('en-US', options); // convert the date to a string with only the date and the specified formatting options

console.log(dateString); // output: "Wednesday, March 9, 2023"

console.log(dateOnlyString); // output: "Wednesday, March 9, 2023"

You can also use other options for the toLocaleString() and toLocaleDateString() methods to format the date string according to different locales and styles.

Converting Strings to Numbers

The JavaScript global method Number() can convert a string into a number.

Empty strings are converted to a numeric 0.

Anything else is converted into NaN (Not a number).

Number("3.14")    // returns numeric 3.14
Number("")       // returns numeric 0 
Number("")        // returns numeric 0
Number("98 98")   // returns NaN

Number("3.14") // returns numeric 3.14

Number("") // returns numeric 0

Number("98 98") // returns NaN

Converting to Boolean

In JavaScript, you can convert other data types to Boolean using the Boolean() function.

Here are the rules for how other data types are converted to Boolean:

Strings: An empty string (“”) is converted to false, while all other strings are converted to true.
Numbers: 0, NaN, and -0 are converted to false, while all other numbers are converted to true.
Null and Undefined: Both null and undefined are converted to false.
Objects and Arrays: All objects and arrays are converted to true.

Here are some examples:

// Converting strings to Boolean
const emptyString = Boolean(""); // false
const nonEmptyString = Boolean("hello"); // true

// Converting numbers to Boolean
const zero = Boolean(0); // false
const nonZero = Boolean(42); // true
const NaNValue = Boolean(NaN); // false

// Converting null and undefined to Boolean
const nullValue = Boolean(null); // false
const undefinedValue = Boolean(undefined); // false

// Converting objects and arrays to Boolean
const emptyArray = Boolean([]); // true
const nonEmptyArray = Boolean([1, 2, 3]); // true
const emptyObject = Boolean({}); // true
const nonEmptyObject = Boolean({ foo: "bar" }); // true

// Converting strings to Boolean

const emptyString = Boolean(""); // false

const nonEmptyString = Boolean("hello"); // true

// Converting numbers to Boolean

const zero = Boolean(0); // false

const nonZero = Boolean(42); // true

const NaNValue = Boolean(NaN); // false

// Converting null and undefined to Boolean

const nullValue = Boolean(null); // false

const undefinedValue = Boolean(undefined); // false

// Converting objects and arrays to Boolean

const emptyArray = Boolean([]); // true

const nonEmptyArray = Boolean([1, 2, 3]); // true

const emptyObject = Boolean({}); // true

const nonEmptyObject = Boolean({ foo: "bar" }); // true

We can also use the double negation (!!x) to convert a value to Boolean, which is equivalent to using the Boolean() function.

Hope you understand Type Conversion in JavaScript.