Arrays

Declaración

Por convenio los arrays se declaran utilizando nombre en plural

var days = new Array();
days[0]="domingo";
days[1]="lunes";
days[2]="martes";
days[3]="miercoles";
days[4]="jueves";
days[5]="viernes";
days[6]="sabado";
var dayNumber = new Date().getDay();
document.write("Hoy es " + days[dayNumber]);
arrays
var days =new Array("domingo", "lunes", "martes", "miercoles", "jueves", "viernes", "sabado");
var dayNumber = new Date().getDay();
document.write("Hoy es " + days[dayNumber]);
arrays 2
<script>
var days = ["domingo", "lunes", "martes", "miercoles", "jueves", "viernes", "sabado"];
var dayNumber = new Date().getDay();
document.write("Hoy es " + days[dayNumber]);
</script>
arrays 3

Añadir y quitar elementos de un array

var datos = ['pera', 'manzana', 'naranja'];
console.log(datos);
datos.push('fresa'); //Añade elemento al final
console.log(datos);
datos.pop(); //Elimina el último elemento
console.log(datos)
datos.splice(1,2) //Elimina un rango de elementos
console.log(datos);	
Ver ejemplo

En javascript no existen los arrays asociativos

var arrayAsociativo = new Array();
arrayAsociativo["one"] = "uno";
arrayAsociativo["two"] = "dos";
arrayAsociativo["three"] = "tres";

document.write(arrayAsociativo["two"]);
document.write("<br/>"+arrayAsociativo.length);
Los arrays asociativos no existen en Javascript

Si cambiamos la palabra "Array" por el nombre utilizado para designar a cualquier otro objeto, el código continúa funcionando. Esto es así porque realmente estamos definiendo las propiedades de un objeto. (En javascript foo["bar"] es lo mismo que foo.bar).

Contar los elementos de un array

document.write(days.length);

Recorrer los elementos del array

Bucle for tradicional

let days = ["domingo", "lunes", "martes", "miercoles", "jueves", "viernes", "sabado"];

for(let i = 0; i < days.length; i++){
	document.write("Hoy es " + days[i] + "<br/>");
}
Recorrer elementos de un array

Bucle for específico

var days = ["domingo", "lunes", "martes", "miercoles", "jueves", "viernes", "sabado"];

for(let i in days){
	document.write("Hoy es " + days[i] + "<br/>");
}
Recorrer elementos de un array

ECMAScript6 style

let days = ["domingo", "lunes", "martes", "miercoles", "jueves", "viernes", "sabado"];

days.map(value => {
	document.write("Hoy es " + value + "<br/>");	
})
Recorrer elementos de un array - ECMAScript6
let days = ["domingo", "lunes", "martes", "miercoles", "jueves", "viernes", "sabado"];

days.map( (value, key) => {
	document.write(key + ": Hoy es " + value + "
"); })
Recorrer elementos de un array - ECMAScript6 usando key

Recorrer el DOM con map

Lo que recupero del dom, no es un array, es un nodelist, que aunque es simliar, no es lo mismo, para convertirlo:

Array.from(filaDatos).map( value => {
	console.log(1)
})

Evaluar si los elementos de un array cumplen cierta condición con filter

El siguiente código evalúa cada uno de los códigos postales almacenados en cps y comprueba si son iguales al valor almacenado en cp_introducido

const result = cps.filter(cp => cp == cp_introducido);

Convertir un objeto en un array de arrays

	const arrayDeArrays = Object.entries(obj);
Convertir objeto en array de arrays

Recorrer un array concatenando sus valores en otro nuevo

	const arrayDeArrays = Object.entries(obj);
Convertir objeto en array de arrays

Ejercicios Arrays

  1. Crea un array con cinco nombres de persona y recórrelo mostrando el texto "Conozco a alguien llamado ".
  2. Recorrer la siguiente lista con un bucle imprimiendo el doble de cada número:

    my_list = [1,9,3,8,5,7]
  3. Contar el número de elementos positivos, negativos y ceros en un array de 10 enteros. Los valores habrán sido harcodeados en un array.
  4. Leer 10 enteros harcodeados en un array y mostrar la media de los valores negativos y la de los positivos.
  5. Programa que lea una variable entera correspondiente a cierto mes, compruebe si el número introducido está entre 1 y 12 y muestre el nombre del mes.

Ejercicio

getElementsByTagName()

<script>
	function saludar(){
		var nombre = document.getElementsByTagName("form")[0].campoNombre.value;
		document.getElementsByTagName("form")[1].campoNombre.value="Hola, señor " + nombre;		
	}
</script>

<form>
	Escribe tu nombre, por favor:
    <input name="campoNombre">
    <input type="button" value="Enviar formulario" onclick="saludar()">
</form>

<form>
    <input name="campoNombre">
</form>

Colección de ejercicios de Javascript II

Cada ejercicio debe estar en un fichero independiente.

Habrá una hora y media de tiempo para tratar de hacer el máximo posible.

Ir a colección

Ejercicio – cambiar color body

Nota:
Para cambiar el estilo de un elemento:

document.getElementById('capa').style.background = opcionEscogida;
icono de mandar un mail¡Contacta conmigo!
contacta conmigoPablo Monteserín

¡Hola! ¿En qué puedo ayudarte?