Espera por favor...

JavaScript
Introducción

JavaScript es un lenguaje interpretado incluido en los documentos HTML.

Tiene un propósito específico: actuar en páginas web.

JavaScript se utiliza, en las páginas HTML para:
  • Visualizar información variable, como fecha, hora, etc.
  • Interactuar con los usuarios a través de ventanas de diálogo
  • Crear menús dinámicos
  • etc.

Se asocia a menudo con otras tecnologías o lenguajes, como DHTML y Java, aunque en general, hay poco parecido entre los lenguajes. En las construcciones imperativas es más parecido al lenguaje C.

Otros lenguajes similares son Microsoft JScript y VBScript

Es texto, no precisa de compiladores o herramientas especializadas

Un editor de textos permite la edición de una página en HTML e insertar instrucciones JavaScript.

JavaScript
Introducción

Aplicaciones de JavaScript

  • Hacer que una página web reaccione a la interacción del usuario. Ejemplo: desplegar un menú al pulsar un enlace.
  • Preprocesar datos en el cliente antes de que sean enviados al servidor (validación de formularios).
  • Cambiar el contenido y el estilo dinámicamente en respuesta a la interacción del usuario (programación dinámica en HTML)

JavaScript
Introducción

Usos no permitidos de JavaScript

El principio de diseño del lenguaje se dirige a proteger la privacidad de los usuarios y evitar accesos no autorizados a sus equipos Por tanto, NO se puede:
  • Establecer o recuperar las preferencias del navegador, cambiar la apariencia de la ventana principal, accionar los botones o la impresión.
  • Ejecutar una aplicación
  • Leer o escribir ficheros o directorios
  • Abrir conexiones de red
  • Enviar correos sin intervención del usuario

JavaScript
Introducción

Cómo encaja JavaScript en una página web:
  • HTML: capa de contenidos. .html
  • CSS: capa de presentación. .css
  • JavaScipt: capa de comportamiento. .js

  • Lenguajes página web

JavaScript
Introducción

¿Qué es un script

Archivo de órdenes, archivo de procesamiento por lotes o guión es un programa simple, que se almacena en un archivo de texto plano. Ejs.:

  • Recetas de cocina
  • Handbooks, manuales de instrucciones para situaciones concretas
  • Manuales de instrucciones de mantenimiento en dispositivos mecánicos

JavaScript
Introducción

Creación de un script

  1. Definir la tarea a ejecutar
  2. Diseñar la tarea mediante una serie de pasos
  3. Codificar cada etapa en el lenguaje elegido

JavaScript
Introducción

JavaScript es:

  • Un lenguaje orientado a objetos
  • Diseñado para crear "pequeños" programas llamados scripts
  • Integrable en páginas HTML
  • Se ejecuta directamente en los navegadores
- Fue creado para la empresa Netscape

- Integrado en Netscape Navigator en 1996

- Estandarizado por ECMA, organismo de normalización suizo (ECMAScript, 1997)

JavaScript
Introducción

Posibilidades de JavaScript

Con JavaScript, se pueden crear páginas web dinámicas

  • Teniendo en cuenta los datos de usuario (introducidos por el teclado o ratón)
  • Capturando y manteniendo estos datos en variables u objetos
  • Ejemplos:
    • Mostrar información variable, como fecha, hora, etc.
    • Interactuar con los usuarios a través de diálogos personalizados
    • Crear menús dinámicos

Hay editores WYSIWYG capaces de generar código JavaScript automáticamente

JavaScript
Introducción

Acceso al contenido

Se puede emplear para seleccionar cualquier elemento, atributo o texto de una página en HTML. Ej.:

  • Seleccionar el texto dentro de todos los elementos <h1> de una página
  • Seleccionar elementos que tengan un atributo class
  • Buscar lo que se ha introducido en una entrada de texto cuyo atributo id tiene valor email

JavaScript
Introducción

Modificación del contenido

Se puede usar para añadir o eliminar elementos, atributos y texto a una página.Ej.:

  • Añadir un párrafo de texto después del primer elemento <h1>
  • Cambiar el valor de los atributos de una class para asignar nuevas reglas CSS
  • Cambiar el tamaño y posición de una imagen

JavaScript
Introducción

Reglas de programación

Se pueden especificar un conjunto de etapas que ha de seguir el navegador, que permiten cambiar el contenido de la página. Ej.:

  • Un script que permite en una galería de fotos ampliarlas al pulsar sobre ellas
  • Una calculadora de intereses que a partir de la información obtenida de un formulario muestra una tabla de amortizaciones
  • Una animación puede detectar las dimensiones de la ventana en el navegador y desplazarla a la base de la zona visible

JavaScript
Introducción

Reacción frente a eventos

Se puede especificar que se ejecute un script como respuesta a un evento. Ej.:

  • Pulsar un botón
  • Seleccionar un enlace
  • El cursor pasa sobre un elemento
  • Se añade contenido a un formulario
  • Ha transcurrido un intervalo temporal
  • Ha terminado de cargarse una página web

JavaScript
Introducción

Características del lenguaje

  • Distingue mayúsculas/minúsculas en los identificadores
  • Comentarios como en Java y C (// y /* ... */)
  • Declaración de variables y parámetros:
  • No se declaran tipos, ej.: var i;
    • Misma variable almacena varios tipos de datos
    • Alcance variables: global y local
  • Ignora espacio en blanco para formateo, por ejemplo en: tabulaciones, nuevas líneas, etc.
  • No es obligatorio terminar con punto y coma (;)
  • Operadores: igual que C/Java
  • Control de flujo (condicionales, bucles)
    • Como en C/Java
    • switch admite cadenas

JavaScript
Introducción

Esquema de una instrucción en JavaScript

document.write ('Texto');

Donde:

objeto: document

. (punto): operador miembro (permite acceder a los miembros de un objeto)

método: write;

parámetros: 'Texto'

JavaScript
Introducción

Escribir un programa en JavaScript ...

Consiste en:
  • Definir las variables (opcional), formadas por un nombre (identificador), el tipo (numérica, caracteres ...) y un valor (que puede ser modificado por operadores)
  • Acceder a los documentos HTML tales como objetos ventanas, documentos, formularios, controles de formulario, etc.
  • Escribir las instrucciones para la ejecución de las acciones deseadas, tales como cálculos, pantallas ...
  • Situar estas instrucciones en los lugares correctos, con las etiquetas <script> </ script>
Advertencia: JavaScript diferencia entre mayúsculas y minúsculas

JavaScript
Introducción

Inserción de código JavaScript en HTML

El código JavaScript se inserta por lo general en la página HTML, también se puede insertar mediante el uso de un archivo externo.
  • En este caso, las etiquetas se convierten en: <script src = "URL"> .... </script>
  • Debe colocarse entre las etiquetas <body> y </ body> en el caso una actuación al inicio de la página
  • O entre las etiquetas <head> y </ head> de la página HTML para ejecución diferida
  • Se escribe y almacena como texto sin formato, en un documento
  • Llamada a módulos comunes en JavaScript desde varias páginas HTML

Ejemplos en: Cómo incluir Javascript en HTML5 y Carga asíncrona de Javascript

JavaScript
Variables

Declaración de variables

Antes de usar una variable es aconsejable declararla. Ej.:

var: aceleracion;

var: Palabra clave para definir variables

aceleracion: Nombre de la variable

Si la variable no se declara mediante el operador var, automáticamente se crea una variable global con ese identificador y su valor. Si hay colisión entre variable global y local, prevalece la local

Ejemplo de variables locales y globales:

function calculo() {
var variable1 = 16; //variable1 es LOCAL
variable2 = variable1 + 4; //variable2 es GLOBAL
}
var variable1 = 16; //variable1 es GLOBAL
function calculo() {
variable2 = variable1 + 4; //variable2 es GLOBAL
}


Denominación de variables

  • El nombre ha de comenzar con una letra, símbolo de dólar o subrayado
  • El nombre no puede contener ni guiones ni puntos
  • No se permiten palabras reservadas de JavaScript
  • Diferencia entre mayúsculas y minúsculas
  • Se recomienda usar un nombre descriptivo del contenido
  • Se recomienda usar la primera letra de cada palabra en mayúsculas


JavaScript
Tipos de datos

Esquema de tipos de datos en JavaScript

Tipos de datos en JavaScript
- Ejemplos de uso de undefined, disponibles en MDN web docs
- Ejemplos de uso de null, disponibles en: MDN web docs

JavaScript
Variables

Arrays

Son un tipo especial de variables

Usuales cuando se trabaja con una lista de valores relacionados

Se denominan como cualquier otra variable

Los valores se asignan entre corchetes ([]), separados con comas (array literal)

Otra posibilidad, palabra clave new seguida de Array, con los valores entre paréntesis (array constructor)

Pueden ser de distintos tipos

JavaScript
Variables

Acceso a valores en un array

Se consideran una lista numerada, que comienza con el elemento 0

Cada elemento recibe automáticamente un número llamado índice (index)

Para recuperar un elemento se indica el nombre del array y entre corchetes el index

El número de elementos se asigna a length

Ejemplos con array

var colores;

colores= ['blanco', 'verde', 'rojo'];


var itemTres;

itemTres = colores[2]


var numeroColores;

numeroColores = colores.length

Cambio de valores en un array

// Crea el array

var colores = ['blanco', 'verde', 'rojo'];


// Modifica el tercer elemento

colores[2] ='azul';

JavaScript
Variables

Expresiones

Una expresión evalúa resultados a un valor único


Hay dos tipos:

  • Asignación de valor a una variable. Ej.: var color='rojo';
  • Expresión que usa valores para dar un resultado. Ej.: var superficie = 9*9;

Los operadores permiten un valor a partir de varios

JavaScript
Operadores

Operadores disponibles en JavaScript

  • Asignación: asignan valor a una variable. color='verde';
  • Aritméticos: permiten operaciones matemáticas básicas. area=8*9;
  • String: combinan dos cadenas de caracteres. saludo = 'Hola' + 'visitante';
  • Comparación: compara dos valores. saldo = 3>5;
  • Lógicos:combinan expresiones: compra = (5>3) && (2<4)

JavaScript
Operadores

Operadores de asignación

    Nombre Abreviado Significado
    Asignación de adicción x += y x = x + y
    Asignación de substracción x -= y x = x - y
    Asignación de multiplicación x *= y x = x * y
    Asignación de división x /= y x = x / y
    Asignación de resto x %= y x = x % y
    Asignación de exponenciación x **= y x = x ** y
    Asignación de desplazamiento a la izquierda x <<= y x = x << y
    Asignación de desplazamiento a la derecha x >>= y x = x >> y
    Asignación sin signo de desplazamiento a la derecha x >>>= y x = x >>> y
    Asignacion AND x &= y x = x & y
    Asignacion XOR x ^= y x = x ^ y
    Asignacion OR x |= y x = x | y

JavaScript
Operadores

Operadores aritméticos

OPERADORES

DESCRIPCIÓN

+

Suma

Resta

*

Multiplicación

/

División

%

Resto de una división entre enteros (mod)

++

Incremento una unidad

--

Decremento una unidad



Orden de ejecución:

Multiplicación y división se ejecutan antes que adición o substracción

Para cambiar el orden se usan paréntesis

Ejemplo:
total=2+4+10; resultado 16

total=2+4*10; resultado 42

total=(2+4)*10; resultado 60

JavaScript
Operadores

Operador string

Se emplea el símbolo + para unir cadenas de caracteres

Los números entre comillas se consideran string
Si se añade un número (sin comillas) pasa a ser parte del string
Si se usan otros operadores aritméticos el resultando es NaN

JavaScript
Operadores

Operadores lógicos

Los operadores lógicos son típicamente utilizados con valores booleanos (valores lógicos) y devuelven un valor booleano


Operador Uso Descripción
&& expr1 && expr2

(AND lógico) Devuelve expr1 si puede ser convertido a false o sino devuelve expr2. Así, cuando se usa con valores boleanos, && devuelve true si ambos operandos son true, en caso contrario devuelve false.

|| expr1 || expr2

(OR lógico) Devuelve expr1 si puede ser convertido a false o si no devuelve expr2. Así, cuando se usa con valores boleanos, && devuelve true si cualquier operandos es true, o false si ambos son falsos.

! !expr

(NOT lógico) Devuelve false si el operando no puede ser convertido a true, en caso contrario, devuelve true

JavaScript
Operadores

Operadores de comparación

Comparan sus operandos y devuelven un valor lógico basado en si la comparación es verdadera (true) o falsa (false)


Operador Descripción Ejemplos devolviendo true
Igualdad (==) Devuelve true si ambos operandos son iguales. 3 == var1

"3" == var1

3 == '3'
Desigualdad (!=) Devuelve true si ambos operandos no son iguales. var1 != 4
var2 != "3"
Estrictamente igual (===)

Devuelve true si los operandos son igual y tienen el mismo tipo.

3 === var1
Estrictamente desiguales(!==)

Devuelve true si los operandos no son igual y/o no tienen el mismo tipo.

var1 !== "3"
3 !== '3'
Mayor que (>)

Devuelve true si el operando de la izquierda es mas grande que el operando de la derecha.

var2 > var1
"12" > 2
Mayor o igual que (>=) Devuelve true si el operando de la izquierda es mas grande que el operando de la derecha. var2 >= var1
var1 >= 3
Menor que (<) Devuelve true si el operando de la izquierda es mas pequeño que el operando de la derecha. var1 < var2
"2" < "12"
Menor o igual que (<=) Devuelve true si el operando de la izquierda es mas pequeño o igual que el operando de la derecha. var1 <= var2
var2 <= 5

JavaScript
Funciones, métodos y objetos

Conceptos

    Funciones: consisten en una serie de sentencias que han sido agrupadas debido a que realizan una tarea específica

    Métodos: como una función, creados en un objeto y son parte

    Objetos: sirven para crear modelos usando datos. Incorporan propiedades y métodos

    Objetos integrados (Built-in Object): objetos integrados en el navegador

JavaScript
Funciones, métodos y objetos

Creación de funciones

Para crear una función se le debe dar un nombre e incluir entre llaves ({}) las sentencias necesarias para ejecutarla

Es el proceso para "declarar una función"

La palabra clave es function

function saluda() {document.write('Hola')};

JavaScript
Funciones, métodos y objetos

Funciones que necesitan información

Al declarar la función se han de indicar parámetros, que actúan como variables

Ejemplo:

function calculaArea(ancho, alto) {return ancho*alto;}

Los argumentos se pueden pasar como valores o como variables. Ej.:

calculaArea(6,4)

anchoPared=6; altoPared=6; calculaArea(anchoPared, altoPared);

JavaScript
Funciones, métodos y objetos

Funciones que retornan un valor único

function calculaArea(ancho, alto) {
var area=ancho*alto;
return area;
}
Var pared1 = calculaArea(3,5);
Var pared2 = calculaArea(8,5);

JavaScript
Funciones, métodos y objetos

Funciones que retornan varios valores

Se considera el ejemplo del cálculo de la superficie y volumen de una caja


function obtieneValores(ancho, alto, profundo) {

var area = ancho*alto; var volumen = ancho*alto*profundo; var valores = [area, volumen]; return valores; }

var area1 = obtieneValores(3,2,3)[0]; var volumen1 = obtieneValores(3,2,3)[1];

JavaScript
Funciones, métodos y objetos

Otras consideraciones

Una expresión genera un valor. Si una función se sitúa donde un navegador espera una expresión (como argumento de una función), se trata como una expresión


Declaración de función. Ej.:

function area(ancho, alto); {return ancho*alto;}; var dimension = area(3,4);


Función expresión. Ej.:

var area = function area(ancho, alto); {return ancho*alto;}; var dimension = area(3,4);

JavaScript
Funciones, métodos y objetos

Ámbito de las variables

El ámbito de una variable es la zona del programa en la que se define la variable. Hay dos ámbitos para las variables: global y local. Ej.:

function creaMensaje() {
var mensaje = “Mensaje de prueba”;
}
creaMensaje(); alert(mensaje);


No se muestra nada, mensaje es una variable local

function creaMensaje() {
var mensaje = “Mensaje de prueba”;
alert(mensaje);
}
creaMensaje();


La variable global, está definida en cualquier sitio (incluso dentro de cualquier función)

JavaScript
Funciones, métodos y objetos

Clase Date

Permite trabajar con fechas y horas

Sintaxis:

new Date();
new Date(valor);
new Date(cadenafecha);
new Date(año, mes [, dia [, horas [, minutos [, segundos [, milisegundos]]]]]);


Si no proporciona argumentos, el constructor crea un objeto Date con la hora y fecha de hoy según la hora local.

Si proporciona algunos argumentos, debe proporcionar al menos 2 argumentos. Los argumentos vacíos se establecen a 0.

La fecha se mide en milisegundos desde la media noche exacta del uno de enero de 1970 en formato UTC. Un día contiene 86 400 000 milisegundos. El rango del objeto Date va desde -100 000 000 días hasta 100 000 000 días respecto del uno de enero de 1970 UTC.

El objeto Date proporciona un comportamiento uniforme entre plataformas.

El objeto Date soporta métodos UTC (universales), además de métodos horarios locales. UTC, también conocido como Greenwich Mean Time (GMT), se refiere a la hora según el Estádar Horario Mundial (World Time Standard). La hora local es la hora establecida por el ordenador donde se ejecuta JavaScript.

Ejemplo (devuelve el tiempo transcurrido entre A y B):

horaA = new Date();
// Sentencias que realizan alguna acción.
horaB = new Date();
diferenciaHoras = horaB - horaA;


Acceso y modificación de fechas

Se definen los métodos get/set para acceder a sus propiedades.

Ejemplos:

getTime() : milisegundos
getFullYear() : 4 digits; getYear() : 2 dígitos
getDate() : devuelve el número del día del mes
getDay(): número del día de la semana (0:Domingo, 6:Sábado)
getHours(), getMinutes(), getSeconds(), getMilliseconds()

JavaScript
Funciones, métodos y objetos

Objetos

Los objetos agrupan un conjunto de variables y funciones para crear un modelo de "algo real"

En un objeto, las variables y funciones adquieren nuevos nombres

Si una variable es parte de un objeto, se llama propiedad, como por ejemplo el nombre de un hotel o número de habitaciones

En un objeto las funciones se denominan métodos. Representan tareas que están asociadas con el objeto. Por ejemplo, se puede comprobar cuántas habitaciones están disponibles

Se usa this para referirse al objeto invocado

JavaScript
Funciones, métodos y objetos

Por ejemplo, sobre un hotel:


Se considera que el hotel tiene cinco propiedades y un método

El valor de un método es siempre una función

El valor de una propiedad puede ser un string, número, booleano, array u otro objeto

var hotel = {
nombre: 'Hotel mediaestrella',
habitaciones: 137,
ocupadas: 30,
tipo habitaciones: ['sencilla', 'doble', 'suite'],
wifi: true,
verificaDisponibilidad: function(){
return this.habitaciones-this.ocupadas;
}
};

JavaScript
Funciones, métodos y objetos

Acceso a objetos

Para acceder a una propiedad o método de un objeto, se usa el nombre del objeto seguido de un punto (.) y a continuación el nombre de la propiedad o método al que se desea acceder. Ej.:

var hotelNombre = hotel.nombre;

var habitacionesLibres = hotel.verificaDisponibilidad();

Para acceder a una propiedad de un objeto se usan corchetes. Ej.:

var hotelNombre = hotel['nombre'];

JavaScript
Funciones, métodos y objetos

Actualización de un objeto

Para actualizar los valores de propiedades de un objeto se usan la notación punto (.) o los corchetes

Para borrar una propiedad se usa la palabra clave delete

Ejemplo de actualización de propiedad:

hotel.nombre = 'Superhotel';
hotel['nombre'] = 'Superhotel';


Ejemplo de delete hotel.nombre;

hotel.nombre = '';

JavaScript
Funciones, métodos y objetos

Función call()

El método call() llama a una función con un valor this asignado y argumentos provistos de forma individual.

Sintaxis:

fun.call(thisArg[, arg1[, arg2[, ...]]])

Donde thisArg es el valor de this provisto por la llamada a fun. Este puede no ser el valor actual visto por el método: si el método es una función en código modo no estricto, null y undefined serán reemplazados con el objeto global, y los valores primitivos serán convertidos a objetos. arg1, arg2, ... son los argumentos para el objeto.

Ejemplo:

var person = {
firstName:"Armando",
lastName: "Lios",
fullName: function() {
return this.firstName + " " + this.lastName;
}
}
var myObject = {
firstName:"Armando",
lastName: "Lios",
}
person.fullName.call(myObject); // Retorna "Armando Lios"

JavaScript
Funciones, métodos y objetos

Función apply()

El método apply() invoca una determinada función asignando explícitamente el objeto this y un array o similar como parámetros (argumentos) para dicha función.

Aunque la sintaxis de esta función es casi idéntica a call(), la diferencia fundamental es que call() acepta una lista de argumentos, mientras que apply() acepta un simple array con los argumentos.

Sintaxis

fun.apply(thisArg[, argsArray])

Donde thisArg es el valor del objeto this a utilizar dentro de la llamada a fun. Éste puede no ser el valor visto por el método: si el método es una función del tipo non-strict mode, null o undefined será reemplazado por el objeto global, y los valores primitivos serán encapsulados. argsArray un objeto similar a un array, que contiene los parámetros con los que será llamada fun, o null o undefined si ningún argumento es estipulado. Desde la versión 5 de ECMAScript estos parámetros pueden estar en un objeto similar a un array en lugar de un array.

JavaScript
Funciones, métodos y objetos

Prototype

JavaScript provoca cierta confusión en desarrolladores con experiencia en lenguajes basados en clases (como Java o C++), por ser dinámico y no proporcionar una implementación de clases en sí mismo.

En lo que a herencia se refiere, JavaScript sólo tiene una estructura: Object, todos los objetos heredan métodos y propiedades de Object.prototype. Cada objeto tiene una propiedad privada (referida como su [[Prototype]]) que mantiene un enlace a otro objeto llamado su prototipo. Ese objeto prototipo tiene su propio prototipo, y así sucesivamente hasta que se alcanza un objeto cuyo prototipo es null. Por definición, null no tiene prototipo, y actúa como el enlace final de esta cadena de prototipos.

Todos los objetos en JavaScript provienen de Object; todos los objetos heredan métodos y propiedades de Object.prototype, aunque pueden ser sobrecargados. Sin embargo, un Object puede ser deliberadamente creado para que esto no sea cierto (por ejemplo usando Object.create(null)), o bien alterado para que no cumpla esta propiedad (por ejemplo usando Object.setPrototypeOf).

Ejemplo en: HACKERNOON y MDN (Mozilla)

JavaScript
Estructuras de control de flujo

Con variables y operadores se tiene una sucesión lineal de instrucciones básicas, aunque habitualmente se necesita otra estructura

Las estructuras de control de flujo, son instrucciones del tipo:

"si se cumple esta condición, hazlo; si no se cumple, haz esto otro"

"repite esto mientras se cumpla esta condición".

Estructura if

La más utilizada en JavaScript. Se emplea para tomar decisiones en función de una condición. Sintaxis:

if(condicion) {
...
}


Si la condición se cumple (true) se ejecutan las instrucciones que se encuentran dentro de {...}

Si no se cumple (false) no se ejecuta ninguna instrucción contenida en {...} y el programa continúa ejecutando el resto de instrucciones

var mostrarMensaje = true;
if(mostrarMensaje) {
alert("Hola");
}


La condición que controla el if() puede combinar los diferentes operadores lógicos y relacionales

Los operadores AND y OR permiten encadenar varias condiciones simples para construir condiciones complejas:

var mostrado = false;
var usuarioPermiteMensajes = true;

if(!mostrado && usuarioPermiteMensajes) {
alert("Primera vez que se muestra el mensaje");
}

JavaScript
Estructuras de control de flujo

Estructura if...else

Las condiciones suelen ser del tipo "si se cumple esta condición, hazlo; si no se cumple, haz esto otro"

Variante de la estructura if llamada if...else. Su sintaxis es la siguiente:

if(condicion) {
...
}
else {
...
}


El siguiente ejemplo muestra si una persona está jubilada

var edad 70;
if(edad >= 70) {
alert("Estás jubilado");
}
else {
alert("Todavía estás trabajando o en el paro");
}

JavaScript

Estructura for

if y if...else no son muy eficientes cuando se desea ejecutar de forma repetitiva una instrucción

Bucle for: "mientras la condición indicada se siga cumpliendo, repite la ejecución de las instrucciones definidas dentro del for. Además, después de cada repetición, actualiza el valor de las variables que se utilizan en la condición"

var mensaje = "Estoy dentro de un bucle";
for(var i = 0; i < 5; i++) {
alert(mensaje);
}

JavaScript
Estructuras de control de flujo

Estructura for...in

Implica el uso de objetos

Sintaxis adaptada a los arrays:

for(indice in array) {
...
}


var dias = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];

for(i in dias) {
alert(dias[i]);
}

JavaScript
Funciones, métodos y objetos

Funciones útiles para cadenas de texto

length, calcula la longitud de una cadena de texto

+, concatena varias cadenas de texto

concat, concatena varias cadenas de texto

toUpperCase(), transforma los caracteres a sus correspondientes caracteres en mayúsculas

toLowerCase(), transforma los caracteres a sus correspondientes caracteres en minúsculas

charAt(posicion), obtiene el carácter que se encuentra en la posición indicada

indexOf(caracter), calcula la posición en la que se encuentra el carácter indicado dentro de la cadena

lastIndexOf(caracter), calcula la última posición en la que se encuentra el carácter indicado dentro de la cadena

substring(inicio, final), extrae una porción de una cadena

split(separador), convierte una cadena de texto en un array de cadenas de texto

length, calcula el número de elementos de un array

concat(), se emplea para concatenar los elementos de varios arrays

join(separador), es la función contraria a split(). Une todos los elementos de un array para formar una cadena de texto

pop(), elimina el último elemento del array y lo devuelve

push(), añade un elemento al final del array

shift(), elimina el primer elemento del array y lo devuelve

unshift(), añade un elemento al principio del array

reverse(), modifica un array colocando sus elementos en el orden inverso

JavaScript
Funciones, métodos y objetos

Funciones útiles para números

NaN, indica un valor numérico no definido

Ej.:
var variable1 = 9;
var variable2 = "DAWeb";
isNaN(variable1); // false
isNaN(variable2); // true


isNaN(), permite proteger a la aplicación de posibles valores numéricos no definidos

Infinity, hace referencia a un valor numérico infinito y positivo (también existe el valor –Infinity para los infinitos negativos)

toFixed(digitos), devuelve el número original con tantos decimales como los indicados por el parámetro

JavaScript
Ubicación del código

Declaración de JavaScript en una página HTML

Indicando el script, habitualmente el código se sitúa en la cabecera:

<script type=“text/javascript” language=“javascript”> ... </script>

En un fichero externo (útil para librerías de funciones):

<script type=“text/javascript”
src=“libreria.js”></script>


En un manejador de evento. Se estudiará más adelante.

JavaScript
Flujo de ejecución del código

Al cargar la página que contiene o referencia código JavaScript:

Todas las sentencias se van ejecutando conforme se carga la página.

La declaración de funciones NO ejecuta la función, si no que solo carga la función en memoria.

El uso de código JavaScript en propiedades/eventos de elementos XHTML no genera su invocación. La invocación se desencadena al producirse el evento asociado.

Búsquedas en UMU