¿Qué hace a JavaScript Interactivo?

JavaScript permite hacer las páginas más interactivas, permitiendo la edición y manejo de la
información de texto y atributos presentes y dar presencia de los cambios en el Web Browser.
Puede dividirse en cuatro puntos clave:
1. Acceso a la Data: Permite acceder a elementos y atributos presentes en el código
2. Modificación de la Data: Permite modificar elementos, atributos, textos y contenido de
una página
3. Establecer Reglas: Designar patrones de comportamiento del navegador, permitiendo
acceder o modificar data en el proceso.
4. Establecer las Reacciones de la Página: Establecer cuáles serán las respuestas del
navegador ante la interacción que este posea con el entorno externo (navegador, usuario,
dispositivo)

Capítulo 1: Script
Los scripts son instrucciones que sigue el ordenador para el cumplimiento de una meta. Puede
existir toda una serie de procedimientos necesarios para las diversas tareas, pero el Browser se
encargará de interpretar cual subconjunto de ellas es necesario en el momento dado, haciendo
uso de distintas partes del código para ello.
Para la escritura de un script primero se ha de detallar cual es la meta que se desea cumplir,
además de la serie de pasos necesarios para completarla. Scripts muy complejos se pueden
interpretar como una agrupación de scripts, siendo cada uno de ellos necesario para una tarea
específica.
Pasos para realizar un Script
 Define el objetivo
 Diseña el Script
 Escribe el código de cada paso

Objetos y Propiedades

Objetos (Objects)
Cada elemento puede representarse como un conjunto de:
 Propiedades
 Eventos
 Métodos
Propiedades
Se hacen denotar como la serie de características que diferencian un objeto de otros. Puede que
sean características de propiedad como de estado. Cada propiedad está compuesta por:
 Nombre (name)
 Value (value)
Y cada conjunto de pares nos dice algo acerca del objeto.
Eventos
Las interacciones con los objetos cambian las propiedades de estos. Un evento es la manera que
tiene el ordenador de tener constancia de algo sucedido o una interacción realizada.
El programa ha de responder cuando un evento específico suceda, esto viene de la mano con que
el evento puede ser utilizado para iniciar una sección específica del código.

Métodos
Se dice de métodos como aquellas tareas que el objeto es capaz de realizar, estas dan como
resultado el retorno o actualización de las propiedades de un objeto. El código de un método
puede contener un grupo de instrucciones que juntas realizan una tarea.

Los Buscadores son Programas Construidos usando Objetos.

El objeto document es uno de la serie de objetos que utilizan los buscadores. Cuando el buscador
crea un modelo de la página web no solo crea un objeto para el document object, sino que
también crea nuevos objetos para cada elemento en la página.
Estos objetos son descritos en el DOM (Document Object Model).

Como usar Objetos y Métodos

El objeto ‘document’ representa toda la página. Es usado por todos los navegadores al hacer un
llamado a su mismo nombre. Este posee distintas propiedades y métodos, conocidos como
miembros del objeto. Se puede acceder a los miembros de un objeto mediante un punto ( . ), este
será llamado member operator.
Cada vez que un método requiera información adicional, este será enviado dentro de los
paréntesis. Esta información es llamada parámetro.
Como un Browser ve una Página Web

La manera en que un buscador ve una página web es la siguiente:

1. Recibe un documento HTML como una página. Cada página está compuesta de un
documento separado.
2. Crear un modelo de la página y almacenarlo en la memoria.
3. Usar un motor de renderizado para mostrar la página en pantalla. Si el buscador no
detecta estilos CSS este asigna estilos predeterminados a los elementos HTML. Si
consigue estilos CSS, el motor de renderizado los procesará y aplicará cada regla a cada
elemento correspondiente.

Los buscadores usan un interprete de JavaScript para llevar las instrucciones encontradas a lenguaje
reconocible por un ordenador. Al ser un lenguaje interpretado, el código es leído línea a línea mientras
corre el script.

Como encajan HTML, CSS y JavaScript juntos

Son normalmente referidos tres lenguajes en la creación de sitios web. Es recomendado de buena
práctica que se escriba cada uno de los lenguajes en archivos distintos.
Capítulo 2: Instrucciones básicas de JavaScript

Como cada lenguaje, existen vocablos, gramática y sintaxis que aprender. Al contrario que el
lenguaje humano, el ordenador procesa estas instrucciones de una forma que lleve a la resolución
de lo que se quiere.

Declaraciones

Las declaraciones son instrucciones escritas en líneas distintas que reflejan una instrucción que el
ordenador debe seguir. Terminan en un punto y coma, este le dice al intérprete que el paso ha
terminado y debe pasar al siguiente paso.
Los códigos de código son un conjunto de instrucciones de código dentro de llaves curvas “{ } ”,
no son cerradas por un punto y coma.

Comentarios

Para facilitar el entendimiento de lo que una instrucción o código de ellas hace, es de buena
práctica la inclusión de comentarios que indiquen lo que hacen determinadas parte del código.
Tipos de comentarios en JavaScript:
 Comentarios de Líneas Múltiples: Son utilizados para indicar mediante descripciones no
breves como una parte del código se comporta, a su vez sirve para que el procesador no
interprete cierta parte del código en un momento dado. Simbología /* */ :
/* Esta es una
descripción*/
 Comentarios de una sola línea: Son usados para comentar lo que hace una instrucción del
código, siendo todo lo escrito después de ella un comentario. Simbología //:
//Comentario
Variable

Un script eventualmente requerirá de almacenar datos necesarios para efectuar ciertas

instrucciones de manera clara. Los humanos pueden almacenar estos en su memoria y hacerlo
directamente, las máquinas por otro lado, requieren de un espacio en concreto en su memoria
para el almacenamiento individualizado de estas variables.
La información almacenada en una variable es susceptible a cambios a lo largo del tiempo. Antes
de poder usar una variable, es necesario declarar esta, instruyendo al ordenador que cree un
espacio en la memoria para ella.
Simbología:
var / let / const varName = varValue;

var / let / const : Son lo que se conoce como Keyword, en este caso el interprete de JavaScript
entiende que debe crear una variable.
varName : El nombre de la variable es como está será identificada a lo largo de todo el script.
Estas siguen patrones tanto impuestos como la sensibilidad a mayúsculas y minúsculas, como la
escritura en camel case. Es a su vez de buena práctica que el nombre de la variable indique el
tipo de información que va a almacenar
= : Es un operador utilizado para asignar un valor a una variable, también es posible usarlo para
reasignar un nuevo valor a una variable
varValue: A menos que se le asigne un valor a una variable, este será asignado como undefined.

Tipos de Datos

Numéricos: Estos representarán datos que van desde los enteros hasta los punto flotante.
String: Consiste en cadenas de letras, números y otros caracteres. Son escritos entre comillas
simples ‘’ o comillas dobles “”.
Booleano: Representan valores que representan dos identidades, ‘true’ o ‘false’.

Existen otros, y serán descritos más adelante.

.
Reglas para Asignar un nombre de variable

1. Las variables deben comenzar con una letra, el signo del dólar o underscore ( _ ). No
debe comenzar con un número.
2. El nombre puede poseer letras, números, el signo del dólar y underscore. No debe poseer
dash ( - ) o puntos ( . ).
3. No deben utilizarse Keywords o Reserved Words debido a que estas de por si cumplen
una labor distinta a cualquier otro nombra, dando instrucciones específicas al intérprete.
4. Todas las variables son sensibles a mayúsculas, siendo entonces dos variables con el
mismo nombre, pero diferenciadas con una mayúscula o minúscula, iguales. Es
igualmente de mala práctica tener dos variables de igual nombre.
5. Es recomendado describir el tipo de dato que será almacenado en el nombre de la
variable.
6. Si el nombre de la variable posee más de una palabra, cada palabra luego de la primera
tendrá su primera letra en mayúsculas.

Arrrays

Son herramientas útiles para almacenar conjuntos de data que tienen relación entre si. Para
almacenar información ha de ser creada al igual que una variable, introduciendo sus elementos
dentro de un par de paréntesis cuadrados ( [ ] ) y separados por comas. No todos los elementos
deber ser del mismo tipo.
El método antes descrito es conocido como array literal, y posee la siguiente forma:
var array1 = [ aVariable, ‘A string’, false, 1 ]
Existe otra forma, hacienda uso de un elemento conocido como constructor, utilizando el
Keyword new seguido por Array(). Es posible a su vez utilizar el método .item(position) para
obtener información de un elemento dentro de una lista de acuerdo a su posición.
var array2 = new Array(aVariable, ‘A string’, false, 1)
array2.item(0) // aVariable
Todo element en un array poseerá una posición designada llamada index. Estos irán desde el 0
hasta un número indeterminado. Para acceder a la información de un elemento de un array, se ha
de hacer referencia a su index dentro de paréntesis cuadrados:
Var nuevoItem = array2[0]
La propiedad length retornará la cantidad de elementos en un array:
Var numDeElementos = array2.length; // 4
Operadores

 Asignación = Asigna valor a una variable

 Aritmético = Realiza operaciones matemáricas básicas
o Adición + = Suma dos variables
o Sustracción - = Resta dos variables
o División / = Divide dos valores
o Multiplicación * = Multiplica dos valores
o Incremento ++ = Suma uno al valor
o Decremento -- = Resta uno al valor
o Módulo = Regresa del resto de la división de dos valores
 String = Combinación de varias strings
 Comparación = Compara dos valores y retorna true/false
 Lógica = Combina expresiones y retorna true/false
Capítulo 3: Funciones, Métodos y Objetos

Debido al grado de detalle que requieren los Browsers para su funcionamiento, existen para
agilizar y ordenar estas largas extensiones de código estructuras como estas.

Funciones y Métodos:
Las funciones son grupos de declaraciones que son agrupadas dado a que hacen una tarea
en concreta al estar juntos, siendo entonces lo métodos exactamente lo mismo salvo a que estos
son construidos dentro de objetos, siendo solo posible efectuar dicha tarea con él.
Objetivos:
Son representaciones de un conjunto de datos que pertenecen a un solo elemento. Posee
propiedades y métodos.
Built-in Objects:
El buscador viene con una serie de objetos que poseen herramientas que agilizan la
creación de páginas web interactivas.

Funciones

Las funciones corresponden a grupos de sentencias que cumplen una tarea específica y llevan a
mantener un orden en el código.
Estas funciones no son ejecutadas directamente cuando la página carga. El script hará un llamado
a ellas cuando requiera que las funciones ejecuten su tarea dentro de unas condiciones
específicas.
Las funciones están compuestas por un nombre, que debe indicar que ha de cumplir ella. A su
vez, esta posee un bloque de código dentro de llaves curvas.
Algunas funciones requieren la entrada de datos para su funcionamiento, estos datos son
conocidos como parámetros. De igual manera, algunas funciones darán un valor como resultado
de su funcionamiento, este valor será conocido como return value.

let mensaje = “Hola mundo”;

function mostrarMensaje(mensaje){
console.log(mensaje);}
 mostrarMensaje();
Una función es creada usando el keyword function.
Para hacer el llamado a una función, se hace el uso del nombre de la función seguido de unas
llaves de paréntesis. Una función puede ser llamada antes de ser declarada, debido a que el
interprete lee todo el script antes de ejecutar cada sentencia.
Cuando se hace un llamado a una función que requiere parámetros, estos valores a introducir
pueden venir en forma de valores o de variables
Algunas funciones retornan información al código que hizo el llamado, esto se realiza mediante
el keyword return. No se reduce solo a una variable, haciendo uso de arrays una función puede
retornar un grupo de ellas.

Funciones Anónimas y Expresiones de Funciones

Cuando es colocada una función donde se espera una expresión, esta será tratada como una
expresión. Esto es llamado function expressions, normalmente se omite el nombre. Una función
sin nombre es llamada función anónima,
Declaración de Funciones
function area(width, height){
return width * height;
}
var size = area (3 , 4);

Expresión de Funciones
area = function(width, height){
return width * height;
}
var size = area (3 , 4);

La expresión de funciones no es procesada hasta que el intérprete llegue a esta declaración, por
lo que no se puede llamar a esta función antes de ser declarada.
Immediately Invoked Function Expressions (IIFE)

Estas funciones no poseen nombre, y además se ejecutan al momento de ser leidas por el
intérprete.

var área = ( function() {

var width = 3;
var height = 5;
return width * height;
}()
);
El paréntesis final (verde) le indica al intérprete que llame a la función inmediatamente.
Los operadores de agrupación (naranja) se aseguran que el intérprete lo interprete como una
expresión.
Las IIFES son utilizadas para secciones de código que deben ser corridas solo una vez a lo largo
del código, más que varias veces.

Variable Scope

De acuerdo a la localización en la que es creada una variable, esta podrá ser usada en
determinadas partes del código. Esto se define en dos tipos:
 Variables Locales: Cuando una variable es declarada dentro de una función usando el
keyword var, se dice que la variable será una function-level scope. No podrá accederse a
ella fuera de la función. El intérprete crea una variable local al momento de correr la
función, y las elimina al momento que termina su ejecución.
 Variables Globales: Si se crea una función fuera de una función esta puede ser usada a lo
largo de todo el script. Son almacenadas en memoria mientras la página esté cargada en
el browser.
Cada variable declarada toma una parte de la memoria, haciendo que mientras más de ellas sean
declaradas más sean necesarias cargar al momento de abrir una página, haciendo en el proceso
que las páginas puedan tardar en cargar.
Propiedades
Dentro de un objeto, una variable definida pasa a ser llamada una propiedad de la misma.

Métodos
Dentro de un objeto, los las funciones pasan a ser conocidas como métodos. Representan tarias
que están asociadas con el objeto.

En la programación existen un gran número de pares nombre/valor:

 HTML usa los atributos name y value
 CSS usa las propiedades name y value
 JavaScript:
o Las variables poseen nombre y se les puede asignar el valor de un string, número
o un booleano
o Los arrays tienen un nombre y un grupo de valores, siendo estos valores a su vez
pares de elementos name(index)/value
o Named Functions poseen un nombre y una aserie de declaraciones que corren
cuando la función es llamada
o Los objetos consisten en una serie de pares name/value a los que son referidos
como keys/value
Creación de un Objeto: Notación Literal

El objeto está compuesto por las llaves curvas y su contenido. El objeto es almacenado en una variable,
que será el nombre usado para referirse a él. Cada key debe separarse de otras, preferiblemente usando
comas. Ej:
var objectEjemplo = {
name: ‘Objeto’,
age: 20,
mostrarInfo(){ //Este es el método asociado
return [this.name, this.age] }
}

Se utilizará el this keyword para indicar que se están usando las propiedades de dicho objeto.
Accediendo a un objeto

 Se puede acceder a las propiedades y métodos de un objeto mediante la notación punto. A

su vez, las propiedades pueden accederse mediante la notación de llaves cuadradas. Ej:

var nameObject = objectEjemplo.name; //Acceso a propiedades

var nameObject = objtectEjemplo[‘name’]; //Acceso a propiedades

var presentacion = objectEjemplo.mostrarInfo(); //Llamado al método

Es un método utilizado cuando:

o El nombre de la propiedad es un número
o Una variable es usada en lugar el nombre de la propiedad
Creación de un Objeto: Notación del Constructor

Utilizando el keyword new y el constructor de objetos Object() es posible crear un objeto en

blanco, a este se le puede agregar métodos y propiedades. Ejemplo:
Var ejemploObject2 = new Object();
ejemploObject2.name = ‘Second’;
ejemploObject2.number = 2;
ejemploObject2.reporte = function(){
return this.number;
};

Esta notación que permite agregar propiedades métodos no discrimina en qué método se haya
utilizado para crear un objeto.
Para actualizar el valor de propiedades se utilizan tanto la notación de punto, como la de
brackets.
Para eliminar propiedades se utiliza el keyword delete.

La notación del constructor posee la cualidad de servir como plantilla para la creación de objetos
similares. El nombre de la función que servirá como plantilla es usualmente escrita con
mayúscula inicial, esto para recordar al usuario de usar el keyword new al momento de crear el
objeto.

Las propiedades que poseerá cada objeto son dadas como argumentos a la función creadora del
objeto, estos separados por comas. Así, para objetos creados, la diferencia en sus propiedades
vendrá con los distintos argumentos que ellos reciban, mientras que los métodos serán iguales.
function EjemploObjeto(color, start, end){
this.color = color;
this.start = start;
this.end = end;
this.imprime = function(){
Console.log(`Color: ${this.color} \nStart: ${this.start}
\nEnd: ${this.end}`);
};
}
var objetoCreado1 = new EjemploObjeto(‘Azul’, 20, 40);
var objetoCreado1 = new EjemploObjeto(‘Verde’, 10, 5);
objetoCreado1.imprime();
objetoCreado2.imprime();

Arrays: Los Arrays son objetos

Los arrays son un tipo especial de objetos, almacenan pares de keys/values como un objetos,
salvo que sus keys son representados por los index number de cada elemento.
Los arrays y los objetos pueden ser combinados para hacer estructuras de data más complicadas.
Los arrays pueden almacenar una serie de objetos recordando su orden, meintras que los objetos
pueden almacenar arrays, haciendo que el orden en que aparecen no sea tan relevante.
objeto = {cualidad1: 100, cualidad2: 200, cualidad3: 300};
array = [100, 200, 300];
Arrays en un Objects
objeto ={
cualidad1 = items[100, 200, 300];
cualidad2 = items[150, 250, 350];
cualidad3 = items[175, 275, 375];
}
Para el acceso al primer elemento de la primera cualidad se usa:
objeto.cualidad1.items[0];

Objects en un Array:

array = [
{cualidad1: 100, cualidad2: 200, cualidad3: 300},
{cualidad1: 50, cualidad2: 550, cualidad3: 1050},
{cualidad1: 10, cualidad2: 490, cualidad3: 970}
];

Para el acceso al primer elemento de la primera posición del index:

array[0].cualidad1;
Built-In Objects

Los navegadores vienen con una serie de built-in objects que son utilizados como kit de
herramientas al momento de aportarle interactividad a los sitios web. Estos pueden venir desde
representaciones de la ventana del browser, así como de la actual página web.
Los built-in objects en general sirven para cumplir funciones que son requeridas por los scripts.
Estarán disponibles una vez la página web ha sido cargada.
Puede accederse a sus propiedades y miembros a partir de la notación punto, al igual que
cualquier otro objeto creado en un archivo de código.

Herramientas Disponibles

1. Browser Object Model

Estos son aquellos objetos que representan el browser o pestaña actual.
2. Document Object Model
Utiliza objectos para representar la página web actual. Crea un objecto para cada elemento y
bloque de texto dentro de la página.
3. Global Javascript Objects
Representan los objetos a los que el lenguaje JavaScript necesita crearles un modelo.
Browser Object Model
Este es el encargado de crear un modelo de la ventana del browser o de la ventana.
El más importate objecto es el window object, siendo el que representa la actual ventana o
pestaña del navegador. Sus objetos hijos representan otras características del buscador
window
document
history
location
navigation
screen

Propiedad Descripción
window.innerHeight Altura de la ventana (excluyendo la interface de Usuario del buscador)
window.innerWidth Anchura de la ventana (excluyendo la interface de Usuario del buscador)
window.pageXOffset Distancia en pixeles que el documento ha sido desplalzado horizontalmente
window.pageYOffset Distancia en pixeles que el documento ha sido desplalzado verticalmente
window.screenX Coordenada X del puntero, relativo a la esquina superior izquierda
window.screenY Coordenada Y del puntero, relativo a la esquina superior izquierda
window.location Actual url del objeto ventana
window.document Referencia al objeto document, que es usado para representar la página
actual contenida en el buscador
window.history Referencia al objeto history para la ventana o pestaña del buscador, esto
puede contener detalles de las páginas que han digo visitadas en esa
ventana o pestaña
window.history.length Número de elementos en el objeto history para la ventana o pestaña
window.screen Referencia al objeto screen
window.screen.width Accede al objeto screen y regresa su ancho en pixeles
window.screen.height Accede al objeto screen y regresa su alto en pixeles

Método Descripción
window.alert() Crea una caja de diálogo con mensaje
window.open() Abre una nueva ventana con el URL especificado como parámetro
window.print( Comunica al navegador que el usuario quiere imprimir contenido de la página
) actual
Document Object Model (DOM)

Crea un modelo de la página actual. El objeto principal será el document, que representará a la
página como un todo. Los elementos hijo representarán otros elementos de la página.

document

<html>

<head> <body>

<title> <div> atribute

<p>

text

Propiedad Descripción
document.title Título del documento actual
document.lastModifie Fecha de la última modificación del documento
d
document.URL Retorna un string conteniendo el URL el documento actual
document.domain Retorna el dominio del documento actual

Método Descripción
document.write() Escribe texto al documento (posee restricciones)
document.getElementById() Retorna elementos si estos concuerdan con el valor del atributo id
que concuerde con el introducido como parámetro
document.querySelectorAll( Regresa una lista de elementos que concuerden con el selector CSS
) especificado en el parámetro
 document,createElement() Crea un nuevo elemento
document.createTextNote() Creta un nuevo nodo de texto
Global JavaScript Objects
Este no forma un solo modelo, sino que está conformado por un grupo de objetos individuales
relacionados cada uno de ellos con distintas partes del lenguaje JavaScript. Los nombres de las
variables globales usualmente inician con mayúsculas.
Los Data Types son representados por:
 String
 Number
 Boolean
Ayulan a lidiar también con conceptos de la vida real:
 Date
 Math
 Regex
Global Objects: String Object

Propiedades Descripción Ejemplo Resultado

sample.length Regresa el número de ‘Home sweet home ‘ 16
caracteres en el string, en la
mayoría de los casos
Método Descripción Ejemplo Resultado
sample.toUpperCase() Cambia los caracteres a ‘Home sweet home ‘ ‘HOME SWEET HOME ‘
mayúsculas
sample.toLowerCase() Cambia los caracteres a ‘Home sweet home ‘ ‘home sweet home ‘
minúsculas
sample.charAt(1) Utiliza el index como ‘Home sweet home ‘ ‘o’
parámetro y retorna el
caracter
sample.indexOf(‘me’) Regresa la primera ‘Home sweet home ‘ 2
posición en la que se
encuentre un caracter
sample.lastIndexOf(‘me’ Regresa la última posición ‘Home sweet home ‘ 13
) en la que se encuentre un
caracter
sample.substring(8,14) Regresa los caracteres entre ‘Home sweet home ‘ ‘eet hom‘
dos posiciones
sample.split(‘ ’) Cada vez que el carácter es ‘Home sweet home ‘ {‘Home’, ‘sweet’, ‘home’, ‘’}
encontrado, hace una
partición del string,
almacenando las partes en
un string
sample.trim(); Remueve espacios vacios ‘Home sweet home ‘ ‘Home sweet home’
al inicio y al final del string
sample.replace(‘me’,’w’) La primera vez que el ‘Home sweet home ‘ ‘How sweet home ‘
primer elemento indicado
es encontrado, es
reemplazado por el
segundo

Global Objects: Number Object

Método Descripción
inNaN() Chequea si el valor es un número
toFixed() Redondea a la indicada cantidad de decimales, retornando un string
toPrecision() Redondea al número total de lugares, retornando un string
toExponential() Retorna un string representando el número en notación exponencial
Global Object: Math Object

Propiedades Descripción
Math.PI Regresa el número de caracteres en el string, en la mayoría de los casos

Método Descripción
Math.round() Redondea el número al entero más cercano
Math.sqrt(n) Retorna la raíz cuadrada de un número positivo
Math.ceil() Redondea hacia arriba al entero más cercano

Math.floor() Redondea hacia abajo al entero más cercano

Math.random() Retorna un número aleatorio entre 0 inclusivo y 1 no inclusivo

Global Object: Date Object

Al momento de trabajar con fechas, se ha de crear una nueva instancia del objeto Date. A esto
luego se puede especificar el tiempo y fecha que se desea representar.

Para crear un objeto del tipo Date se ha de usar el constructor Date(), que predeterminadamente
utilizará los valores de la fecha y horas actuales. Si en cambio, se quiere almacenar otros datos,
se ha de especificar la fecha y hora que se desea registrar.

var hoy = new Date();

Poseyendo tres formatos distintos para identificar fechas:
var ayer = new Date(2021, 4, 12, 15, 45, 55);
var ayer = new Date(‘Apr 12, 2021, 15:45:55’);
var ayer = new Date(2021, 4, 12);
Una vez creado el objeto Date, existen una serie de métodos asociados que permiten obtener
información:
Método Descripción
getDate() / setDate() Retorna o establece el día del mes (0-31)
getDay() Retorna el día de la semana (0-6)
getFullYear() / setFullYear() Retorna o establece el año (4 digitos)

getHours() / setHours() Retorna o establece las horas del día (0-23)

getMiliseconds() / setMiliseconds() Retorna o establece los miliseguntos (0-999)

getMinutes() / setMinutes() Retorna o establece los minutos (0-59)

getMonth() / setMonth() Retorna o establece el mes (0-11)

getSeconds() / setSeconds() Retorna o establece los segundos (0-59)

getTime() / setTime() Número de milisegundos desde el 1 de enero de 1970 a las

00:00:00 UTC, siendo las fechas anteriores tomadas como
negativas.
getTimezoneOffset() Retorna la zona horaria en minúsculas

toDateString() Retorna la fecha de forma entendible

toTimeString() Retorna la hora de forma entendible

toString() Retorna un string que representa la fecha

Capítulo 4: Decisiones y Bucles

El código ha de recorrer distintos recorridos de acuerdo a distintas condiciones, lo que significa

que el buscador ha de poseer distintas instrucciones sobre lo que realizar ante cada una de ellas.

 Evaluaciones: Realizar análisis que comprueban distintas situaciones.

 Decisiones: A partir de los resultados de las evaluaciones, se elige cual camino se ha de
recorrer.
 Bucles: Cuando se desea que el código se mantenga realizando las mismas instrucciones
ante unas condiciones dadas.

Toma de Decisiones

Existirán situaciones en las que una decisión ha de ser determinante en cuales líneas de código
han de ser recorridas a continuación. Por ello, los distintos caminos ha recorrer han de ser
descritos en código, siendo cada uno de ellos asignados a una condición. En diagrama de flujo
son referidos con la figura del diamante:

1 Condición
2

Código del Código del

Condicional 1 Condicional 2

Continuación
del Código

Las condiciones están compuestos de dos elementos:

 Una expresión que es evaluada
  Una condición que decide el camino a recorrer

Operadores de Comparación

== : Es igual a
Este operador compara dos valores y retorna true si son iguales, false en caso contrario. Ejemplo:
‘Hello’ == ‘Hello’ // true
‘Hello’ == ‘Jello’ // false

===: Estrictamente igual a

Chequea si tanto el dato como el tipo de dato son iguales. Ejemplo:
3 === 3 // true
‘3’ === 3 // false

!= : No es igual a
Compara dos valores y arroja true si no son iguales.
‘Hello’ != ‘Goodbye’ // true
‘Hello’ != ‘Hello’ // false

!==: Estrictamente distinto a

Chequea si tanto el dato como el tipo de dato son distintos. Ejemplo:
3 !== 3 // false
‘3’ !== 3 // true
Mayor que: >
Chequea si el número a la izquierda es mayor que el de la derecha

Menor que: <

Chequeda si el número a la izquierda es menor que el de la derecha

Mayor o igual que >=

Chequea si el número a la izquierda es mayor o igual que el de la derecha

Menor o igual que <=

Chequea si el número a la izquierda es menor o igual que el de la derecha

Operadores Lógicos
Los operadores lógicos permiten comparar los resultados de más de un operador de comparación.

AND lógico &&:

Arroja true solo si ambas expresiones arrojan true, en cualquier otro caso arroja false.

OR lógico ||:
Arroja true si al menos una de las expresiones son true, en caso de que ambos sean false, retorna false.

NOT lógico:
El operador toma el valor booleano e invierte su valor. Por lo que si su valor es true pasa a ser falso, y
viceversa.
Declaraciones IF:
La declaración if evalúa a una condición. Si esta es verdadera, se ejecuta el bloque de código señalado en
las llaves.
if (condition){
Code to execute;
}

Declaraciones IF ELSE:

Verifica si el condicional arroja true, para lo cual ejecuta un bloque de código. En caso de arrojar false,
corre un segundo bloque de código.
if (condition){
Code to execute;
}
else{
Code to run instead;
}

Declaración SWITCH:

Toma una variable y se especifican los distintos bloques de código asociados a los posibles valores
esperados de la variable.

switch (variable){
case ‘one’:
code 1;
case ‘two’:
code 2;
default:
code 3;
}

Diferencias entre If…Else con Switch

If…Else
No existe necesitad de colocar un Else
Una serie de If serán chequeados uno a uno a
pesar que uno de ellos ya haya sido validado
Switch
Existe una opción Default en caso de que ninguno
de los casos coincida
Si uno de los casos coincide, corre el código
contenido y luego lee el comando break, saliendo
de la declaración Switch y poseyendo mejor
velocidad

Data Coercion

Se dice que los lenguajes que permiten mutar el tipo de las variables que son descritas en ellos poseern
un Weak Typing, siendo Strong Typing aquellos que no permiten esto.

JavaScript permite mutar entre los distintos tipos de datos entre variables en determinadas ocasiones
para evitar errores, esto es llamado Type Cohersion.

Esto puede llevar a errores en la ejecución del código. Es por ello que se recomienda el uso de === y !==
por encima de == y != debido a que estos últimos no chequean si el tipo de datos es igual.
Valores Verdaderos y Falsos

Dado al Type Cohersion, Javascript interpreta los valores a maneras de Truthy o Falsy

Falsy: Son valore considerados Falsos

Valor Descripción
let highscrore = false Valor booleano falso
let highscrore = 0 Número cero
let highscrore = ‘’ Valor vacío
let highscrore = 10/0 NaN (Not a number)
let highscrore Una variable declarada, pero sin valor asignado

Truthy: Valores que son tratados como verdaderos, incluyendo casi todos aquellos no Falsy, a la vez de
la presencia de elementos.

Valor Descripción
let highscrore = true Valor booleano verdadero
let highscrore = 1 Número distinto a cero
let highscrore = ‘Carrot’ String no vacio
let highscrore = 10/5 Número verdadero
let highscrore = ‘false’ false escrito en una string
let highscrore = ‘0’ Cero escrito como string

Dado a que la existencia de un objeto o array en una página es usualmente chequeada su existencia
para saber si existe o no un elemento en la página.