Objetos Nativos Del Lenguaje Javascript
Objetos Nativos Del Lenguaje Javascript
Objetos Nativos Del Lenguaje Javascript
En este tema vamos a ver las funciones globales de Javascript (muchas de las cuales ya hemos visto como Number() o String()) y los objetos
nativos que incorpora Javascript y que nos facilitarán el trabajo proporcionándonos métodos y propiedades útiles para no tener que “reinventar
la rueda” en nuestras aplicaciones. Dentro de ellos está el objeto RegExpr que nos permite trabajar con expresiones regulares (son iguales que
en otros lenguajes) que nos serán de gran ayuda, sobre todo a la hora de validar formularios y que por eso veremos en la siguiente unidad.
Funciones globales
• parseInt(valor): devuelve el valor pasado como parámetro convertido a entero o NaN si no es posible la conversión. Este método es
mucho más permisivo que Number y convierte cualquier cosa que comience por un número (si encuentra un carácter no numérico detiene
la conversión y devuelve lo convertido hasta el momento). Ejemplos:
• Number(valor): convierte el valor a un número. Es como parseFloat pero más estricto y si no puede convertir todo el valor devuelve NaN.
Ejemplos:
• Boolean(valor):convierte el valor pasado a un booleano. Sería el resultado de tenerlo como condición en un if. Muchas veces en vez de
usar esto usamos la doble negación !! que da el mismo resultado. Ejemplos:
• encodeURI(string)/ decodeURI(string): transforma la cadena pasada a una URL codificada válida transformando los caracteres especiales
que contenga, excepto , / ? : @ & = + $ #. Debemos usarla siempre que vayamos a pasar una URL. Ejemplo:
o Decoded: “http://domain.com?val=1 2 3&val2=r+y%6”
o Encoded: “http://domain.com?val=1%202%203&val2=r+y%256”
• encodeURIComponent(string) / decodeURIComponent(string): transforma también los caracteres que no transforma la anterior. Debemos usarla
para codificar parámetros pero no una URL entera. Ejemplo:
o Decoded: “http://domain.com?val=1 2 3&val2=r+y%6”
o Encoded: “https%3A%2F%2Ffanyv88.com%3A443%2Fhttp%2Fdomain.com%3Fval%3D1%202%203%26val2%3Dr%2By%256”
Objetos nativos del lenguaje
En Javascript casi todo son objetos. Ya hemos visto diferentes objetos:
• window
• screen
• navigator
• location
• history
• document
Los 5 primeros se corresponden al modelo de objetos del navegador (BOM, Browser Object Model) y document se corresponde al modelo de
objetos del documento (DOM, Document Object Model, ya lo hemos visto). Todos nos permiten interactuar con el navegador para realizar
distintas acciones.
Pero además tenemos los tipos de objetos nativos, que no dependen del navegador. Son:
• Number
• String
• Boolean
• Array
• Function
• Object
• Math
• Date
• RegExp
Además de los tipos primitivos de número, cadena, booleano, undefined y null, Javascript tiene todos los objetos indicados. Como vimos se
puede crear un número usando su tipo primitivo (const num = 5) o su objeto (const num = new Number(5)) pero es mucho más eficiente usar los
tipos primitivos. Pero aunque lo creemos usando el tipo de dato primitivo se considera un objeto y tenemos acceso a todas sus propiedades y
métodos (num.toFixed(2)).
Ya hemos visto las principales propiedades y métodos de Number, String, Boolean y Array y aquí vamos a ver las de Math y Date y en el
apartado de validar formularios las de RegExp.
Objeto Math
Proporciona constantes y métodos para trabajar con valores numéricos:
• constantes: .PI (número pi), .E (número de Euler), .LN2 (algoritmo natural en base 2), .LN10 (logaritmo natural en base
10), .LOG2E (logaritmo de E en base 2), .LOG10E (logaritmo de E en base 10), .SQRT2 (raíz cuadrada de 2), .SQRT1_2 (raíz cuadrada de 1⁄2).
Ejemplos:
Ejemplos:
Ejemplos:
const date1=new Date() // Mon Jul 30 2018 12:44:07 GMT+0200 (CEST) (es cuando he ejecutado la instrucción)
const date7=new Date(1532908800000) // Mon Jul 30 2018 00:00:00 GMT+0200 (CEST) (miliseg. desde 1/1/1070)
const date2=new Date('2018-07-30') // Mon Jul 30 2018 02:00:00 GMT+0200 (CEST) (la fecha pasada a las 0h. GMT)
const date3=new Date('2018-07-30 05:30') // Mon Jul 30 2018 05:30:00 GMT+0200 (CEST) (la fecha pasada a las 05:300h. local)
const date6=new Date('30-07-2018') // Mon Jul 30 2018 00:00:00 GMT+0200 (CEST) (OJO: formato MM-DD-AAAA)
const date6=new Date('07-30-2018') // Invalid date
const date7=new Date('30-Jul-2018') // Mon Jul 30 2018 00:00:00 GMT+0200 (CEST) (tb. podemos poner 'July')
const date4=new Date(2018,7,30) // OJO: Thu Ago 30 2018 00:00:00 GMT+0200 (CEST) (OJO: 0->Ene,1->Feb... y a las 0h. local)
const date5=new Date(2018,7,30,5,30) // OJO: Thu Ago 30 2018 05:30:00 GMT+0200 (CEST) (OJO: 0->Ene,1->Feb,...)
EJERCICIO: Crea en la consola dos variables fecNac1 y fecNac2 que contengan tu fecha de nacimiento. La primera la creas pasandole una cadena
y la segunda pasándole año, mes y día
Cuando ponemos la fecha como texto, como separador de las fechas podemos usar -, / o espacio. Como separador de las horas debemos usar :.
Cuando ponemos la fecha cono parámetros numéricos (separados por ,) podemos poner valores fuera de rango que se sumarán al valor
anterior. Por ejemplo:
const date=new Date(2018,7,41) // Mon Sep 10 2018 00:00:00 GMT+0200 (CEST) -> 41=31Ago+10
const date=new Date(2018,7,0) // Tue Jul 31 2018 00:00:00 GMT+0200 (CEST) -> 0=0Ago=31Jul (el anterior)
const date=new Date(2018,7,-1) // Mon Jul 30 2018 00:00:00 GMT+0200 (CEST) -> -1=0Ago-1=31Jul-1=30Jul
Tenemos métodos getter y setter para obtener o cambiar los valores de una fecha:
• day: devuelve el número de día de la semana (0->Dom, 1->Lun, …, 6->Sáb). Este método NO tiene setter:
• hours, minutes, seconds, milliseconds, : devuelve/cambia el número de la hora, minuto, segundo o milisegundo, respectivamente.
• time: devuelve/cambia el número de milisegundos desde Epoch (1/1/1970 00:00:00 GMT):
EJERCICIO: Realiza en la consola los siguientes ejercicios (usa las variables que creaste antes)
Una forma sencilla de copiar una fecha es crear una nueva pasándole la que queremos copiar:
En realidad lo que le estamos pasando es el tiempo Epoch de la fecha (es como hacer otraFecha=new Date(fecha.getTime()))
NOTA: la comparación entre fechas funciona correctamente con los operadores >, >=, < y <= pero NO con ==, ===, != y !== ya que compara los
objetos y ve que son objetos diferentes. Si queremos saber si 2 fechas son iguales (siendo diferentes objetos) el código que pondremos NO
es fecha1 === fecha2 sino fecha1.getTime() === fecha2.getTime().
EJERCICIO: comprueba si es mayor tu fecha de nacimiento o el 1 de enero de este año