JavaScript

JavaScript es uno de los lenguajes de programacion mas populares en la tierra y se utiliza para agregar interactividad en paginas web, procesar datos y crear aplicaciones (aplicaciones moviles, aplicaciones de escritorio, juegos y mas).
Este lenguaje nos permite crear programas ya sea del lado del cliente o del lado del servidor.

---

ESTRUCTURA

Java Script vive dentro del documento html. En html, el codigo JavaScript debe insertarse entre las etiquetas script:

JavaScript se puede colocar en las secciones body y head de la pagina html.
En el siguiente ejemplo lo colocamos dentro de la etiqueta body.

Normalmente la etiqueta script se coloca en la cabecera del documento HTML (etiqueta head).

---

PRIMER CODIGO (Hello Wordl!)

Usaremos JavaScript para imprimir “Hello Word!” en el navegador.
INPUT

OUTPUT

La funcion document.write() escribe una cadena en nuestro documento HTML. Esta funcion se puede usar para escribir texto, HTML o ambos.

---

FORMATOS DE TEXTO

Al igual que en HTML, podemos usar etiquetas HTML para formatear texto en JavaScript.
INPUT

OUTPUT

---

ATRIBUTOS DE LA ETIQUETA script

La etiqueta script puede tomar dos atributos, idioma y tipo, que especifican el tipo de script.

El atributo de idioma (languaje) esta en desuso y no debe usarse.
El atributo tipo (type) tampoco es necesario, ya que JavaScript es el lenguaje de script HTML prederminado.

---

JAVASCRIPT COMO ARCHIVO EXTERNO

Las secuencias de comandos tambien se pueden colocar en archivos externos. Los scripts externos son utiles y practicos cuando se usa el mismo codigo en varias paginas web diferentes.
Los archivos JavaScript tienen la extension de archivo .js.
Para usar un script externo, coloque el nombre del archivo de script en el atributo scr (fuente) de la etiqueta script.

Archivo de Prueba HTML

Archivo JavaScript (prueba.js)

Los archivos JavaScript en cache pueden acelerar la carga de la pagina.

---

VARIABLES

Las variables son contenedores para almacenar valores de datos. El valor de una variable puede cambiar a lo largo del programa.
Use la palabra clave var para declarar una variable.

---

TIPOS DE DATOS

El termino tipo de datos se refiere a los tipos de valores con los que puede trabajar un programa. Las variables de JavaScript pueden contener muchos tipos de datos, como numeros, cadenas, matrices y mas.
El tipo de variable var admite la mayoria de tipo de datos: entero, flotante, string (cadena de texto), carácter, arreglo (array),booleano, etc.

Para el tipo de dato string, se puede obtener comillas dobles o simples dentro de la cadena usando el carácter de escape \ como \” o \’.

---

OPERADORES ARITMETICOS

Los operadores aritmeticos realizan funciones aritmeticas en numeros (literales o variables).

Podemos obtener el resultado de una expresion de cadena utilizando la funcion eval(), que toma un argumento de expresion de cadena como eval(“10*20+8”) y devuelve el resultado. Si el argumento esta vacio, devuelve indefinido.
INPUT

OUTPUT

Incremento y decremento

Incremento ++: El operador de incremento incrementa el valor numerico de su operando en uno. Si se coloca antes del operando, devuelve el valor incrementado. Si se coloca despues del operando, devuelve el valor original y luego incrementa el operando.
Decremento --: El operador de decremento disminuye el valor numerico de su operando en uno. Si se coloca antes del operando, devuelve el valor decrementado. Si se coloca despues del operando, devuelve el valor original y luego disminuye el operando.

---

OPERADORES DE ASIGNACION

Los operadores de asignacion asignan valores a las variables de JavaScript.

---

OPERADORES DE COMPARACION

Los operadores de comparacion se utilizan en declaraciones logicas para determinar la igualdad o diferencia entre variables o valores. Devuelven verdadero o falso.

---

OPERADORES LOGICOS

Los operadores logicos, tambien conocidos como operadores booleanos, evaluan la expresion y devuelven verdadero y falso.
La siguiente tabla explica los operadores logicos (AND, OR, NOT).

Operador condicional Ternario

INPUT

OUTPUT

---

CONDICIONALES Y BUCLES

La declaracion if

Use if para especificar un bloque de codigo que se ejecutara si una condicion especifica es verdadera.
INPUT

OUTPUT

La declaracion else

Use la instrucción else para especificar un bloque de codigo que se ejecutara si la condicion es falsa.
INPUT

OUTPUT

Declaracion else-if

Usar la instrucción else if para especificar una nueva condicion si la primera condicion es falsa.
INPUT

OUTPUT

Declaracion switch

La instrucción switch se usa para realizar diferentes acciones basadas en diferentes condiciones.
Se puede lograr el mismo resultado con multiples declaraciones if else, pero la declaracion switch es mas efectiva.
INPUT

OUTPUT

Bucle for

El clasico bucle for tiene tres componentes o declaraciones.
INPUT

OUTPUT

La instrucción 1 se puede omitir si sus valores se establecen antes de que comience el ciclo.
INPUT

OUTPUT

Se puede iniciar mas de un valor en la instrucción 1, usando comas para separalos.
INPUT

OUTPUT

Bucle while

Este bucle repite un bloque de codigo, siempre que una condicion especificada sea verdadera.
INPUT

OUTPUT

Bucle do-while

Es una variante del bucle while. Este bucle ejecutara el bloque de codigo una vez, antes de verificar si la condicion es verdadera, y luego repetira el bucle siempre en cuando la condicion sea verdadera.
INPUT

OUTPUT

Herramientas dentro de los bucles

Break

La instrucción break salta de un bucle y continua ejecutando el codigo despues del bucle.
INPUT

Una vez que i llegue a 5, saldra del bucle.
OUTPUT

Continue

La instrucción continue solo rompe una iteracion en el ciclo y continua con la siguiente iteracion.
INPUT

OUTPUT

El valor 5 no se imprime, porque continue omite esa iteracion del bucle.

---

FUNCIONES

Una funcion en JavaScript es un bloque decodigo diseñado para realizar una tarea en particular.
Funciones definidas por el usuario
Para definir una funcion de JavaScript, use la palabra clave function, seguida de un nombre, seguido de parentesis().
El codigo que debe ejecutar la funcion se coloca entre llaves {}.
Llamar a una funcion
Para ejecutar la funcion, debe llamarla. Para llamar a una funcion, comience con el nombre de la funcion, luego siga con los argumentos entre parentesis.
INPUT

OUTPUT

Parametros de funciones

Las funciones pueden tomar parametros. Los parametros de la funcion son los nombres enumerados en la definicion de la funcion.
INPUT

Esta funcion toma un parametro que se llama nombre. Al llamar a la funcion, proporcione el valor del parametro (argumento) dentro de los parentesis.
OUTPUT

Parametros Multiples

Puede definir multiples parametros para una funcion separandolos por comas.
Al llamar a la funcion, proporcione los argumentos en el mismo orden en que los definio.
Si pasa mas argumentos de los definidos, se asignaran a una arreglo llamado arguments. Se pueden usar asi: arguments[0], arguments[1], etc.
INPUT

O utilizando arguments[].

OUTPUT

Declaracion return

Una funcion puede tener una declaracion return opcional. Se utiliza para devolver un valor de la funcion. Esta declaracion es util al hacer calculos que requieren un resultado.
INPUT

OUTPUT

Si la funcion no devuelve nada, el resultado sera undefined.
INPUT

OUTPUT

Funciones alert, prompt y confirm

JavaScript ofrece tres tipos de cuadros emergentes, los cuadros alert, prompt y confirm.

Cuadro alert

Se utiliza alert cuando desea asegurarse de que la informacion llegue al usuario. Cuando aparece un cuadro alert, el usuario debe hacer clic en Aceptar para continuar.
La funcion alert toma un solo parametro, que es texto que se muestra en el cuadro emergente.
INPUT

OUTPUT

Cuadro prompt

El cuadro prompt se usa a menudo para que el usuario ingrese un valor antes de ingresar a una pagina.
Cuando aparece el cuadro prompt, el usuario tendra que hacer clic en Aceptar o Cancelar para continuar despues de ingresar el valor de entrada.
Si el usuario hace clic en OK, el cuadro retorna el valor de entrada. Si el usuario hace clic en Cancel, el cuadro retorna null.
La funcion prompt toma 1 parametro y devuelve 1 string.
INPUT

OUTPUT

Cuadro confirm

A menudo se usa la funcion confirm para que el usuario verifique o acepte algo. Cuando aparece un cuadro confirm, el usuario debe hacer clic en Aceptar o Cancelar para continuar.
Si el usuario hace clic en Aceptar, el cuadro devuelve true. Si el usuario hace clic en Cancelar, el cuadro devuelve false.
INPUT

OUTPUT

El resultado cuando el usuario hace click en Aceptar

El resultado cuando el usuario hace click en Cancel

---

OBJETOS

Las variables de JavaScript son contenedores para valores de datos. Los objetos tambien son varibles, pero pueden contener muchos valores.

Propiedades del Objeto

Puedes acceder a las propiedades del objeto de dos maneras.
NombredelObjeto.NombredelaPropiedad ó NombredelObjeto[‘NombredelaPropiedad’]
Este ejemplo demuestra com acceder la edad de nuestro objeto persona.
INPUT

OUTPUT

La propiedad incorporada length en JavaScript es utilizada para contar el numero de caracteres en una propiedad o cadena de texto.
INPUT

OUTPUT

El Constructor de Objetos

Anteriormente creamos un objeto utilizando la sintaxis de literal de objeto.

Esto te permite crear un unico objeto. Algunas veces necesitamos configurar un tipo de objeto que pueda ser usado para crear un numero de objetos de un mismo tipo.
La forma estandar para crear un “tipo de objeto ” es utilizando la funcion constructora de objetos.

La funcion anterior (persona) es un constructor de objeto, que toma parametros y los asigna a las propiedades del objeto.
La palabra clave this refiere al objeto actual. Nota que this no es una variable. Es una palabra clave, y su valor no puede ser cambiado.

Creando Objetos

Creado el constructor de objetos, puedes utilizar la palabra clave new para crear nuevos objetos del mismo tipo.
INPUT

p1 y p2 son ahora objetos del tipo persona. Sus propiedades son asignadas a los valores correspondientes.
OUTPUT

Metodos de Objeto

Un metodo de objeto es una propiedad que contiene la definicion de una funcion.
Se utiliza la siguiente sintaxis para crear un metodo de objeto.
NombredelMetodo=function(){ lineas de codigo }
Se utiliza la siguiente sintaxis para acceder al metodo del objeto.
NombredelObjeto.NombredelMetodo()
INPUT
Definimos una funcion como nombre, sin parametros de entrada, que retorna el nombre “Darwin”.

OUTPUT

Un metodo es una funcion, que pertenece a un objeto. Puede ser referenciada utilizando la palabra clave this.
La palabra clave this la puedes utilizar para acceder a las propiedades y metodos de los objetos.
La definicion de metodos se realiza dentro del constructor de la funcion.
INPUT

OUTPUT

Tambien se puede definir la funcion fuera de del constructor y asociarla con el objeto.
INPUT

OUTPUT

---

OBJETOS ESCENCIALES

Arreglos

Los arreglos registran multiples valores en una sola variable. Se utiliza la siguiente sintaxis para crear un arreglo.
NombredelArray= new Array( elementos separados por comas)