Conversión de tipo javaScript

Number() se convierte en Number, String() se convierte en String, Boolean() se convierte en Boolean.

Tipos de datos Javascript

En Javascript hay 5 tipos diferentes de datos:

  • string
  • number
  • boolean
  • object
  • function

Hay 6 tipos posibles de objetos:

  • Object
  • Date
  • Array
  • String
  • Number
  • Boolean

Y 2 tipos de datos que no pueden contener valores:

  • null
  • undefined

El operador typeof

Puedes usar el operador typeof para encontrar el tipo de dato de una variable Javascript.

Ejm

<!DOCTYPE html>
<html>
<body>

<h2>The JavaScript typeof Operator</h2>

<p>The typeof operator returns the type of a variable, object, function or expression.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
typeof "john" + "<br>" +
typeof 3.14 + "<br>" +
typeof NaN + "<br>" +
typeof false + "<br>" +
typeof [1,2,3,4] + "<br>" +
typeof {name:'john', age:34} + "<br>" +
typeof new Date() + "<br>" +
typeof function () {} + "<br>" +
typeof myCar + "<br>" +
typeof null;
</script>

</body>
</html>

Observa

  • El tipo de dato NaN es un número
  • El tipo de dato de un Array es un objeto
  • El tipo de dato de Date es un objeto
  • El tipo de dato de null es un objeto
  • El tipo de dato de undefined es undefined
  • El tipo de dato de una variable que no tiene valor asignado es undefined

No puede usar typeof para determinar si un objeto JavaScript es una matriz (o una fecha).

El tipo de datos de typeof

El tipo de operador no es una variable. Es un operador. Los operadores (+ – * /) no tienen ningún tipo de datos.

Pero, el operador typeof siempre devuelve una cadena (que contiene el tipo de operando).

La propiedad constructor

La propiedad constructor devuelve la función constructor para todas las variables de JavaScript.

Ejm

<!DOCTYPE html>
<html>
<body>

<h2>The JavaScript constructor Property</h2>

<p>The constructor property returns the constructor function for a variable or an 
object.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
"john".constructor + "<br>" +
(3.14).constructor + "<br>" +
false.constructor + "<br>" +
[1,2,3,4].constructor + "<br>" +
{name:'john', age:34}.constructor + "<br>" +
new Date().constructor + "<br>" +
function () {}.constructor;
</script>

</body>
</html>

Devuelve

The JavaScript constructor Property

The constructor property returns the constructor function for a variable or an object.

function String() { [native code] }
function Number() { [native code] }
function Boolean() { [native code] }
function Array() { [native code] }
function Object() { [native code] }
function Date() { [native code] }
function Function() { [native code] }

Puedes comprobar la propiedad del constructor para averiguar si un objeto es un Array (contiene la palabra “Array”):

Ejm

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Arrays</h2>

<p>This "home made" isArray() function returns true when used on an array:</p>

<p id="demo"></p>

<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = isArray(fruits);

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

</body>
</html>

O incluso más simple, puedes verificar si el objeto es una función Array:

Ejm

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Array Object</h2>
<p>This "home made" isArray() function returns true when used on an array:</p>

<p id="demo"></p>

<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = isArray(fruits);

function isArray(myArray) {
return myArray.constructor === Array;
}
</script>

</body>
</html>

Puedes comprobar la propiedad del constructor para averiguar si un objeto es una fecha (contiene la palabra “Date”)

Ejm

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Date Object</h2>
<p>This "home made" isDate() function returns true when used on an date:</p>

<p id="demo"></p>

<script>
var myDate = new Date();
document.getElementById("demo").innerHTML = isDate(myDate);

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

</body>
</html>

O incluso más simple, puedes verificar si el objeto es una función de Date.

Ejm

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Date Object</h2>
<p>This "home made" isDate() function returns true when used on an date:</p>

<p id="demo"></p>

<script>
var myDate = new Date();
document.getElementById("demo").innerHTML = isDate(myDate);

function isDate(myDate) {
return myDate.constructor === Date;
}
</script>

</body>
</html>

Conversión de tipo JavaScript

Las variables de JavaScript se pueden convertir en una nueva variable y otro tipo de datos:

  • Mediante el uso de una función de JavaScript
  • Automáticamente por JavaScript mismo

Convirtiendo números en string

El método global String() puede convertir números en cadenas.

Se puede utilizar en cualquier tipo de números, literales, variables o expresiones:

Ejm

String(x)         // returns a string from a number variable x
String(123)       // returns a string from a number literal 123
String(100 + 23)  // returns a string from a number from an expression

El método Number toString() hace lo mismo.

Ejm

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

Convirtiendo booleanos en string

El método global String() puede convertir booleanos en cadenas.

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

El método booleano toString() hace lo mismo.

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

Convirtiendo fechas en string

El método global String() puede convertir fechas en cadenas.

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

El método Date toString() hace lo mismo.

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

Convirtiendo strings a números

El método global Number() puede convertir cadenas en números. Las cadenas que contienen números (como “3,14”) se convierten en números (como 3,14). Las cadenas vacías se convierten en 0. Cualquier otra cosa se convierte en NaN (no es un número).

Ejm

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

El operador uranio +

El operador uranio + se puede usar para convertir una variable en un número.

Ejm

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

Si la variable no se puede convertir, seguirá siendo un número, pero con el valor NaN (no un número):

Ejm

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

Convirtiendo booleanos en números

El método global Number() también puede convertir booleanos en números.

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

Convirtiendo fechas a números

El método global Number() se puede utilizar para convertir fechas en números.

Ejm

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

El método Date getTime() hace lo mismo.

Ejm

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

Tipos de conversión automáticos

Cuando JavaScript intenta operar con un tipo de datos “incorrecto”, intentará convertir el valor en un tipo “correcto”.

El resultado no siempre es el esperado:

Ejm

5 + null    // returns 5         because null is converted to 0
"5" + null  // returns "5null"   because null is converted to "null"
"5" + 2     // returns "52"      because 2 is converted to "2"
"5" - 2     // returns 3         because "5" is converted to 5
"5" * "2"   // returns 10        because "5" and "2" are converted to 5 and 2

Conversión automática de cadenas

javaScript llama automáticamente a la función toString() de la variable cuando intenta “generar” un objeto o una variable:

Ejm

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

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

Tabla de conversión de tipos de JavaScript

Valor original Convertido a Number Convertido a String Convertido a Boolean
false 0 “false” false
true 1 “true” true
0 0 “0” false
1 1 “1” true
“0” 0 “0” true
“000” 0 “000” true
“1” 1 “1” true
NaN NaN “NaN” false
Infinity Infinity “Infinity” true
-Infinity -Infinity “-Infinity” true
“” 0 “” false
“20” 20 “20” true
“twenty” NaN “twenty” true
[ ] 0 “” true
[20] 20 “20” true
[10,20] NaN “10,20” true
[“twenty”] NaN “twenty” true
[“ten”,”twenty”] NaN “ten,twenty” true
function(){} NaN “function(){}” true
{ } NaN “[object Object]” true
null 0 “null” false
undefined NaN “undefined” false

Los valores entre comillas indican valores de cadena.