- Arrays en JavaScript
- Arrays multidimensionales en JavaScript
- Manejar arrays en JavaScript
- Buscar en arrays en JavaScript
En esta ocasión vamos a realizar un ejercicio para practicar el uso de arrays en JavaScript.
El ejercicio quiere que resolvamos los siguientes puntos.
- Pide seis números por pantalla y los meta en un array
- Mustra el array entero (todos sus elementos) en el cuerpo de la página y en la consola
- Ordena y muestra el array
- Muestra cuantos elementos tiene el array
- Búsca un valor introducido por el usuario, dica si lo encuentra y su índice
- Creamos la variable global
numeros
como una lista. Ha de ser global para que se puede leer por todas las funciones. También creamos la variable globaln
que contendrá el número de elementos solicitados que es de seis. - Invocamos la función
solicita(n)
que pedirá al usuarion
números enteros y los añadirá a la listanumeros
usandopush
. La función retornanumeros
que al ser una variable global ya puede ser usada por todos. - Creamos una copia de
numeros
llamadanumerosbis
. Esta copia usaslice()
ya que en caso contrario la copia que pretendemos crear no sería una copia autonoma sino un alias. Estos supone que si métodos comosort
oreverse
afectan la listanumeros
de forma irreversible tambíen afectarían a su alias. Deseamos quenumerosbis
sea una copia independiente y no un alias por lo que para conseguirlo hemos tenido que usarslice()
. - Mostramos el número de elementos con
length
. - Mostramos el array original
numeros
. - Invocamos la función
cuerpo()
que muestra en el cuerpo de la página los valores del array uno a uno usandofor(var i in numeros)
para recorrer todos ellos. - Mostramos los valores ordenados usando
numeros.sort()
. Esto consigue que la ordenación se haga según el código unicode, esto es, considerando los valores como cadenas alfanuméricas donde, por ejemplo, 101 precede a 2, porque en orden alfabético va antes. - Para mostrar un orden numérico se ha de usar
sort
con una función de ordenación dentro de sus paréntesis. En este caso hemos incluido una función de flecha siguiendo este link de Mocilla. - El inconveniente de usar
sort
es que se modifica la lista original, este es el motivo por el que se realizó una copia, manteniedo ennumerosbis
la lista inicial. - Si ahora hacemos
numeros.reverse()
estaremos obteniendo el reverso de lo que contiene ahora la listanumeros
. Esto supone que obtendremos los números ordenados en orden de mayor a menor, pero no estaremos obteniendo el reverso de la lista original. - Para conseguir el reverso de la lista de
numeros
original aplicmosreverse()
sobrenumerosbis
que es la copia que sacamos en su momento. Pero si no queremos que esta copia también quede modificada de forma permanente lo que tenemos que hacer es escribirnumerosbis.slice().reverse()
. Esto mismo se podría haber utilizado consort
usandonumeros.slice().sort()
. - Comprobamos que
numerosbis
no ha sido modificada y conserva los números de la lista origienal.
- Finalmente pedimos a usuario un número para ver si existe en el array que se ha formado. Esto lo hacemos invocando la función
buscar()
que nos pide el número buscadonumbuscado
y que confindIndex(función de flecha)
asignan a la variableindice
un booleanotrue
ofalse
que nos indica si se ha encontrado o no el número buscado.
'use strict'
var numeros=[]; //variable global
var n=6; //variable global
function solicita(n){
for(var i=0;i<n;i++){
var nuevo=parseInt(prompt("Indique un número entero: "));
numeros.push(nuevo);
}
return numeros;
}
function cuerpo(){
var texto="<h3>Elementos del array</h3>"
for(var i in numeros){texto+=numeros[i]+"<br>"}
document.write(texto);
}
function buscar(){
var numbuscado=parseInt(prompt("¿Qué número desea buscar?: "));
var indice=numerosbis.findIndex(item => item==numbuscado);
if(indice==-1){
var mensaje="Número "+numbuscado+" no encontrado";
}else{
var mensaje="Número "+numbuscado+" encontrado en la posición: "+indice;
}
console.log(mensaje);
}
solicita(n); //construimos el array
const numerosbis=numeros.slice(); //copia la lista para tener un duplicado
console.log("Número de elementos: ",numeros.length); //número de elementos
console.log("Valores iniciales: ",numeros); //se mustra en consola el array original
cuerpo(); //mostramos el array en página web, uno a uno
console.log("Ordenados unicode: ",numeros.sort()); //array ordenado
console.log("Ordenando numeros: ",numeros.sort((a,b)=>a-b)); //numeros ordenados
console.log("En orden inverso: ",numeros.reverse()); //lo muestra en orden inverso
console.log("Reverse original: ",numerosbis.slice().reverse());
console.log("Valores iniciales: ",numerosbis); //aún tenemos los números iniciales
buscar();
Podemos establecer un código alternativo para la función
cuerpo()
que usaría numeros.forEach(función de flecha)
. function cuerpo(){
var texto="<h3>Elementos del array</h3>"
numeros.forEach(item => {texto+=numeros[item]+"<br>"});
document.write(texto);
}
No hay comentarios:
Publicar un comentario