Coding With Fun
Home Docker Django Node.js Articles Python pip guide FAQ Policy

JavaScript type conversion


May 06, 2021 JavaScript


Table of contents


JavaScript type conversion


Number() is converted to numbers, String() to strings, and Boolean() to Boolean values.


JavaScript data type

There are 5 different data types in JavaScript:

  • string
  • number
  • boolean
  • object
  • function

3 object types:

  • Object
  • Date
  • Array

2 data types that do not contain any values:

  • Null
  • undefined

Typeof operator

You can use the typeof operator to view the data types of JavaScript variables.

typeof "John" Return string
typeof 3.14 Returns number
typeof N aN Returns number
typeof false Return to boolean
typeof [ 1 , 2 , 3 , 4 ] Return object
typeof {name: 'John' , age:34} Return object
typeof new Date() Return object
typeof function () {} Return function
typeof myCar Return to undefined (if myCar is not stated)
typeof null // return object

Try it out . . .

Please note:

  • The data type for NaN is number
  • The data type of the array is object
  • The data type for date is object
  • The data type of null is object
  • The data type of the variable that is not defined is undefined

If the objects are JavaScript Array or JavaScript Date, we can't tell their type by typeof because they all return Object.


The constructor property

The constructor property returns the constructor for all JavaScript variables.

"John" .constructor Return function String() .
( 3.14 ). c onstructor Return function Number() .
false.constructor Return function Boolean ()
[ 1 , 2 , 3 , 4 ].constructor Return function Array() .
{name: 'John' , age:34}.constructor Return function Object() .
new D ate().constructor Return function Date() .
function () . .

Try it out . . .

You can use the constructor property to see if the object is an array (including the string "Array"):

function isArray(myArray) {
return myArray.constructor.toString().indexOf( "Array" ) > -1 ;
}

Try it out . . .

You can use the constructor property to see if the object is a date (including the string "Date"):

function isDate(myDate) {
return myDate.constructor.toString().indexOf( "Date" ) > -1 ;
}

Try it out . . .


JavaScript type conversion

JavaScript variables can be converted to new variables or other data types:

  • By using javaScript functions
  • Automatic conversion through JavaScript itself

Convert the number to a string

The global method String() converts numbers to strings.

This method can be used for any type of number, letter, variable, expression:

String(x) Convert variable x to string and return
String( 123 ) Convert the number 123 to a string and return it
String (100 x 23) // Converts the numeric expression to a string and returns

Try it out . . .

The Number method to String() has the same effect.

x.toString()
( 123 ). t oString()
( 100 + 23 ).toString()

Try it out . . .

In the Number Methods section, you can find more ways to convert numbers to strings:

Method Describe
toExponential() Converts the value of an object to exponential counting.
toFixed() Converts a number to a string, resulting in a number with a specified number of digits after the number of points.
toPrecision() Format the number to the specified length.


Convert the Boolean value to a string

The global method String() converts Boolean values to strings.

String( false ) Return "false"
String (true) // returns "true"

The Boolean method to String() has the same effect.

false.toString() Return "false"
true.toString() // returns "true"


Convert the date to a string

The global method String() converts the date to a string.

String (Date())// Return to Thu Jul 17 2014 15:38:19 GMT plus 0200 (W. Europe Daylight Time).

The Date method to String() has the same effect.

Date (.toString() // Returns Thu Jul 17 2014 15:38:19 GMT-0200 (W. Europe Daylight Time).

In the Date Method section, you can see more about functions that convert dates to strings:

Method Describe
getDate() Returns a day of the month (1 to 31) from the Date object.
getDay() Returns a day of the week (0 to 6) from the Date object.
getFullYear() The year is returned in four digits from the Date object.
getHours() Returns the hour of the Date object (0 to 23).
getMilliseconds() Returns the date object's milliseconds (0 to 999).
getMinutes() Returns the minutes of the Date object (0 to 59).
getMonth() Returns the month (0 to 11) from the Date object.
getSeconds() Returns the number of seconds (0 to 59) of the Date object.
getTime() Returns the number of milliseconds from January 1, 1970 to the present.


Convert the string to a number

The global method Number() converts strings to numbers.

Strings contain numbers (such as "3.14") converted to numbers (such as 3.14).

The empty string is converted to 0.

The other strings are converted to NaN (not a number).

Number( "3.14" ) Returns 3.14
Number( " " ) Returns 0
Number( "" ) Returns 0
Number ("99 88") // Returns NaN

In the Number Methods section, you can see more about how strings turn into numbers:

Method Describe
parseFloat() Resolve a string and return a float.
parseInt() Resolve a string and return an integer.


The one-dollar operator

Operator plus can be used to convert variables to numbers:

var y = "5" ; y is a string
var x = + y; //x is a number

Try it out . . .

If the variable cannot be converted, it will still be a number, but the value is NaN (not a number):

var y = "John" ; y is a string
var x = + y; //x is a number (NaN).

Try it out . . .


Convert boolean values to numbers

The global method Number() converts Boolean values to numbers.

Number( false ) Returns 0
Number (true) // returns 1


Convert the date to a number

The global method Number() converts dates to numbers.

d = new Date();
Number(d) // Returns 1404568027739

The date method getTime() has the same effect.

d = new Date();
d.getTime() // Return 1404568027739


Automatic conversion type Type Conversion

When JavaScript tries to manipulate an "wrong" data type, it automatically converts to the "correct" data type.

The following output is not what you expect:

5 + null Returns 5 because null is converted to 0
"5" + null Return "5null" because null is converted to "null"
"5" + 1 Return "51" because 1 is converted to "1"
"5" - 1 // Returns 4 because "5" is converted to 5


Automatic conversion to strings

JavaScript automatically calls the variable's toString() method when you try to output an object or a variable:

document.getElementById( "demo" ).innerHTML = myVar;

if myVar s name: "Fjohn" // toString converted to "object Object"
if myVar s 1,2,3,4' // toString converted to "1,2,3,4"
if myVar s new Date() // toString converted to "Fri Jul 18 2014 09:08:55 GMT-0200"

Numbers and Boolean values are also often converted to each other:

if myVar s 123 // toString converted to "123"
if myVar s true // toString converted to "true"
if myVar s false // toString converted to "false"

Null

In JavaScript null means "nothing" and is a special type with only one value, representing an empty object reference.

When set to "null", it can be used to empty an object:

var person = null; The value is null (empty), but the type is an object

Tip: You can use typeof to detect that the null return is object.


undefined

In JavaScript, undefined is a variable that does not have a value set.

If a variable does not have a value set, undefined is returned:

var person; The value is undefined (empty), and the type is undefined

Related articles

JavaScript Standard Reference Tutorial: JavaScript Data Type Conversion