JavaScript Type Conversion

Number() converts to a number, String() converts to a string, Boolean() converts to a boolean.

JavaScript Data Types

In JavaScript there are 6 different data types:

  • string
  • number
  • boolean
  • object
  • function
  • symbol

3 object types:

  • Object
  • Date
  • Array

2 data types that contain no value:

  • null
  • undefined

typeof Operator

You can use thetypeofoperator to view the data type of a JavaScript variable.

Examples

typeof "John"                 // returns string
 typeof 3.14                   // returns number
 typeof NaN                    // returns number
typeof false                  // returns boolean
typeof [1,2,3,4]              // returns object
 typeof {name:'John', age:34}  // returns object
typeof new Date()             // returns object
typeof function () {}         // returns function
 typeof myCar                  // returns undefined (if myCar is not declared)
 typeof null                   // returns object

Try it yourself »

Please note:

  • The data type of NaN is number
  • The data type of an array (Array) is object
  • The data type of a date (Date) is object
  • The data type of null is object
  • The data type of an undefined variable is undefined

If the object is a JavaScript Array or JavaScript Date, we cannot usetypeofto determine their type, because they all return object.

constructor Property

constructorThe property returns the constructor function for all JavaScript variables.

Examples

"John".constructor                 // returns function String() { [native code] }
 (3.14).constructor                 // returns function Number() { [native code] }
 false.constructor                  // returns function Boolean() { [native code] }
 [1,2,3,4].constructor              // returns function Array() { [native code] }
 {name:'John', age:34}.constructor  // returns function Object() { [native code] }
 new Date().constructor             // returns function Date() { [native code] }
 function () {}.constructor         // returns function Function() { [native code] }

Try it yourself »

You can use the constructor property to check whether an object is an array (contains the string "Array"):

Examples

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

Try it yourself »

You can use the constructor property to check whether an object is a date (contains the string "Date"):

Examples

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

Try it yourself »

JavaScript Type Conversion

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

  • By using JavaScript functions
  • By JavaScript's own automatic conversion

Converting Numbers to Strings

Global methodString()can convert numbers to strings.

This method can be used for any type of numbers, letters, variables, expressions:

Examples

String(x)         // convert variable x to a string and return it
 String(123)       // convert the number 123 to a string and return it
 String(100 + 23)  // convert a numeric expression to a string and return it

Try it yourself »

Number methodstoString()also have the same effect.

Examples

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

Try it yourself »

InNumber methodsIn the chapter, you can find more methods for converting numbers to strings:

Method Description
toExponential() Converts the value of an object to exponential notation.
toFixed() Converts a number to a string, with a specified number of digits after the decimal point.
toPrecision() Formats a number to a specified length.

Converting Booleans to Strings

Global methodString()can convert booleans to strings.

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

Boolean methodstoString()also have the same effect.

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

Converting Dates to Strings

Date() returns a string.

Date()      // returns Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)

The global method String() can convert a date object to a string.

String(new Date())      // returns Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)

Date methodstoString()also have the same effect.

Examples

obj = new Date()
obj.toString()   // returns Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)

InDate methodsIn the chapter, you can see more functions for converting dates to strings:

Method Description
getDate() Returns the day of the month (1 ~ 31) from a Date object.
getDay() Returns the day of the week (0 ~ 6) from a Date object.
getFullYear() Returns the year from a Date object as a four-digit number.
getHours() Returns the hour of a Date object (0 ~ 23).
getMilliseconds() Returns the milliseconds of a Date object (0 ~ 999).
getMinutes() Returns the minutes of a Date object (0 ~ 59).
getMonth() Returns the month (0 ~ 11) from a Date object.
getSeconds() Returns the seconds of a Date object (0 ~ 59).
getTime() Returns the number of milliseconds since January 1, 1970.

Converting Strings to Numbers

Global methodNumber()can convert strings to numbers.

Strings containing numbers (like "3.14") are converted to numbers (like 3.14).

An empty string is converted to 0.

Other strings will be converted to NaN (not a number).

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

InNumber methodsIn the chapter, you can find more methods for converting strings to numbers:

Method Description
parseFloat() Parses a string and returns a floating-point number.
parseInt() Parses a string and returns an integer.

Unary Operator +

Operator + can be used to convert a variable to a number:

Examples

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

Try it yourself »

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

Examples

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

Try it Yourself »

Converting Booleans to Numbers

The global methodNumber()can convert booleans to numbers.

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

Converting Dates to Numbers

The global methodNumber()can convert dates to numbers.

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

The Date methodgetTime()has the same effect.

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

Automatic Type Conversion

When JavaScript tries to operate on a "wrong" data type, it will automatically convert it to the "correct" data type.

The following output is not what you expected:

5 + null    // Returns 5 null converts to 0
"5" + null  // Returns "5null" null converts to "null"
 "5" + 1     // Returns "51" 1 converts to "1"
 "5" - 1     // Returns 4 "5" converts to 5

Automatic Conversion to Strings

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

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

myVar = {name:"Fjohn"} // toString converts to "[object Object]"
 myVar = [1,2,3,4] // toString converts to "1,2,3,4"
 myVar = new Date() // toString converts to "Fri Jul 18 2014 09:08:55 GMT+0200"

Numbers and booleans are also often converted to each other:

myVar = 123 // toString converts to "123"
 myVar = true // toString converts to "true"
 myVar = false // toString converts to "false"

The table below shows converting different values to numbers (Number), strings (String), and booleans (Boolean):

Primitive value Converted to Number Converted to String Converted to Boolean Example
false 0 "false" false Try it Yourself »
true 1 "true" true Try it Yourself »
0 0 "0" false Try it Yourself »
1 1 "1" true Try it Yourself »
"0" 0 "0" true Try it Yourself »
"000" 0 "000" true Try it Yourself »
"1" 1 "1" true Try it Yourself »
NaN NaN "NaN" false Try it Yourself »
Infinity Infinity "Infinity" true Try it Yourself »
-Infinity -Infinity "-Infinity" true Try it Yourself »
"" 0 "" false Try it Yourself »
"20" 20 "20" true Try it Yourself »
"Example" NaN "Example" true Try it Yourself »
[ ] 0 "" true Try it Yourself »
[20] 20 "20" true Try it Yourself »
[10,20] NaN "10,20" true Try it Yourself »
["Example"] NaN "Example" true Try it Yourself »
["Example","Google"] NaN "Example,Google" true Try it Yourself »
function(){} NaN "function(){}" true Try it Yourself »
{ } NaN "[object Object]" true Try it Yourself »
null 0 "null" false Try it Yourself »
undefined NaN "undefined" false Try it Yourself »
Other extensions