CU01153E funciones arrays javascript pust sort ordena numeros

Anuncio
Funciones predefinidas JavaScript para arrays.
APRENDERAPROGRAMAR.COM
FUNCIONES ARRAYS
JAVASCRIPT. PUSH, SORT
(ORDENAR NÚMEROS),
CONCAT, JOIN, POP,
SHIFT, SLICE, SPLICE.
(CU01153E)
Sección: Cursos
Categoría: Tutorial básico del programador web: JavaScript desde cero
Fecha revisión: 2029
Resumen: Entrega nº53 del Tutorial básico “JavaScript desde cero”.
© aprenderaprogramar.com, 2006-2029
Autor: César Krall
Funciones predefinidas
p
JavaScript para arrays.
a
FUNCIONES PREDEFIN
NIDAS PARA
A ARRAYS (AR
RREGLOS)
JavaScriptt proporcion
na una seriee de funciones predefinidas para el manejo d
de arrays. Entre
E
ellas
podemos citar concaat, join, splitt, pop, push
h, shift, unsshift, reversee. Vamos a estudiarlas. Recordar
también que
q para con
nocer el núm
mero de elem
mentos en un array bastta con invocaar la propied
dad length
del array escribiendo nombreArraay.length
blas se resumen funciones que pueden ser úttiles para trrabajar con arrays en
En las sigguientes tab
JavaScriptt. Algunas dee ellas ya fueeron nombradas cuando hablamos dee funciones p
para cadenas de texto,
ya que JavvaScript asem
meja las cadeenas de texto como arrays de caracteres.
Supondreemos que A1, A2, A3, A4 y A5 son arrays JavaScrip
pt.
ÑADIR ELEMEENTOS O CO
ONCATENAR ARRAYS
FUNCIONES PARA AÑ
FUNCIÓ
ÓN
concat(it1,,
… , itN)
it2,
UTTILIDAD
EJEMPLO
OS aprenderraprogramarr.com
Devu
uelve la conccatenación dee it1, it2,
…, itN
i
con el array sobre el
e que se
invo
oca. It1, it2, …,
… itN pueden ser tipos
prim
mitivos u objettos.
var
v A3 = A1.co
oncat(5, 9);
Añad
de x al final del array com
mo nuevo
(o nuevos)
n
elem
mento, y devvuelve la
nuevva longitud deel array.
A1.push(55,
A
66
6);
Añad
de x al principio del arrray como
nuevvo (o nuevos) elementos.
A1.unshift([77
A
, 88, 99]);
splice (in
nd, 0,
it1, it2, … , itN)
difica el array añadieendo los
Mod
elem
mentos it1, it2,
i
…, itN, que son
insertados en la posiciión ind
(dessplazando a lo
os existentes).
A1.splice(3,
A
0, 'xxx', 'yyy');
splice
(ind,
cuant, it1, it2, …
, itN)
Mod
difica el array eliminand
do cuant
elem
mentos e inseertando it1, itt2, …, itN,
desd
de el índice ind.
ejemplo.splice
e
e(3, 2, 'es', 'un
n', 'en');
push(x)
unshift(x)
© aprenderraprogramar.co
om, 2006-2029
var
v A4 = A1.co
oncat(A2);
var
v A5 = A1.co
oncat([-4, 22, 1
11]);
//Añade 55 y 66
6 al final
//Ahora A1 tieene 3 elementtos más, al principio
//Inserta xxx en posición 3, yyy en po
osición 4 y
desplaza
d
a los elementos exxistentes antes.
//Se borran do
os elementos y se insertan tres, con lo
que
q la longitud
d del array es 1 más de la anterior.
Funciones predefinidas JavaScript para arrays.
FUNCIONES PARA EXTRAER ELEMENTOS O PARTES DE UN ARRAY CON ELIMINACIÓN
FUNCIÓN
pop()
UTILIDAD
EJEMPLOS aprenderaprogramar.com
Elimina el último elemento del array y
lo devuelve.
var ultimoElemento = A1.pop();
Elimina el primer elemento del array y
lo devuelve.
var primerElemento = A1.shift();
(ind,
Modifica el array borrando cuant
elementos a partir del índice ind.
A1.splice(3, 2);
splice
(ind,
cuant, it1, it2, …
, itN)
Modifica el array eliminando cuant
elementos e insertando it1, it2, …, itN,
desde el índice ind.
ejemplo.splice(3, 2, 'es', 'un', 'en');
delete A[ind]
Elimina el elemento con índice ind del
array A. El contenido a[ind] pasa a ser
undefined.
delete A[7];
shift()
splice
cuant)
//Ahora A1 tiene 1 elemento menos
//Ahora A1 tiene 1 elemento menos
//Se borran dos elementos y se insertan tres, con lo
que la longitud del array es 1 más de la anterior.
//Ahora A[7] contiene undefined
FUNCIONES PARA EXTRAER PARTES O ELEMENTOS DE UN ARRAY SIN ALTERARLO
FUNCIÓN
UTILIDAD
EJEMPLOS aprenderaprogramar.com
slice
(firstIn,
lastOut)
Devuelve un array con los elementos extraídos
entre los índices firstIn y lastOut-1. Es decir, el
elemento en la posición firstIn se incluye y el
elemento en la posición lastOut se excluye.
var result = [1, 2, 3, 4, 5].slice(1,4);
slice (firstIn)
Devuelve un array con los elementos extraídos
entre el índice firstIn y el último elemento. Si
se indica un valor negativo, se extrae un array
con los firstIn últimos elementos.
var result = [1, 2, 3, 4, 5].slice(-2)
//result contiene [2, 3, 4]
//result contiene [4, 5]
FUNCIONES PARA RECUPERAR ÍNDICES DE POSICIONES
FUNCIÓN
UTILIDAD
EJEMPLOS aprenderaprogramar.com
indexOf(x)
Busca x dentro del array y devuelve la posición
de la primera ocurrencia.
var result = A1.indexOf(14);
lastIndexOf()
Busca x dentro del array empezando por el final
y devuelve la posición de primera ocurrencia.
var result = A1.lastIndexOf(14);
© aprenderaprogramar.com, 2006-2029
Funciones predefinidas JavaScript para arrays.
FUNCIONES PARA TRANSFORMAR ARRAYS EN STRINGS O TIPOS PRIMITIVOS
FUNCIÓN
UTILIDAD
join(separador)
Une los elementos de un array en una
cadena de texto donde cada elemento
está separado por ‘separador’.
var frase = ['quiero', 'aprender'].join(' ');
Une los elementos de un array en una
cadena de texto donde cada elemento
está separado por una coma.
var frase = ['quiero', 'aprender'].toString();
Este
método
devuelve
la
representación como tipo primitivo de
un objeto. En el caso de un array, hace
lo mismo que el método toString().
alert (A1.valueOf());
toString()
valueOf()
EJEMPLOS aprenderaprogramar.com
//frase es tipo String y contiene ‘quiero aprender’
//frase es tipo String y contiene ‘quiero,aprender’
//Mismo resultado que alert(A1);
FUNCIONES QUE PERMITEN ORDENAR O REORDENAR ARRAYS
FUNCIÓN
reverse()
sort()
UTILIDAD
EJEMPLOS aprenderaprogramar.com
Invierte el orden de los elementos en el array
(el final pasa a ser el principio).
A1.reverse();
Si no recibe parámetros, ordena los
elementos del array por orden alfabético
(que no coincide con el numérico), quedando
el array modificado. Comentaremos esta
función con más detenimiento.
var result = [2, 11, 111, 7].sort();
//Los elementos quedan ordenados al revés
//result vale [11, 111, 2, 7] porque el orden es
alfabético, no numérico.
LA FUNCIÓN SORT JAVASCRIPT. CÓMO ORDENAR NUMÉRICAMENTE
Hemos visto que [2, 11, 111, 7].sort() devuelve [11, 111, 2, 7] porque el array se ordena por orden
alfabético y alfabéticamente cualquier número que contenga un 1 inicial se coloca antes que cualquier
número que contenga un 2 inicial, independientemente de cuál de los dos números es mayor o menor.
Si el array contiene elementos undefined, estos se colocan al final del array.
Nos planteamos ahora, ¿cómo ordenar números de menor a mayor (o de mayor a menor)?
Para que la función sort ordene de forma distinta a la predeterminada se le debe pasar como
parámetro una función de comparación. Por ejemplo:
© aprenderaprogramar.com, 2006-2029
Funciones predefinidas JavaScript para arrays.
[3, 5, 1, 7, 4].sort (funcionDeComparacion);
Donde funcionDeComparacion debe ser una función que reciba como parámetros dos elementos del
tipo con el que trabaja el array y devuelva un número negativo si el primer elemento debe ordenarse
antes que el segundo, cero si ambos elementos tienen igual orden, o un número positivo si el segundo
elemento debe ordenarse antes que el primero.
Definir una función de comparación que permita ordenar un array numérico de menor a mayor es
sencillo:
function funcionDeComparacion (elem1, elem2) {
return elem1 – elem2;
}
Esta función devuelve un número positivo si elem1 es mayor que elem2, con lo cual elem1 se colocará
detrás. Si escribimos return elem2 – elem1 se ordenará de mayor a menor.
Escribe el siguiente código y comprueba los resultados.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><title>Ejemplo aprenderaprogramar.com</title><meta charset="utf-8">
<script type="text/javascript">
function ejemplo() {
var miArrayOriginal = [1, 4, 2, 9, 11, 44, 111, 7, 4];
var miArray = [1, 4, 2, 9, 11, 44, 111, 7, 4];
var msg ='El array original es: ' + miArrayOriginal +'\n';
msg = msg + 'Ordenado de mayor a menor es ' + miArray.sort(deMayorAMenor)+'\n';
msg = msg + 'Ordenado de menor a mayor es ' + miArray.sort(deMenorAMayor)+'\n';
alert(msg);
}
function deMenorAMayor(elem1, elem2) {return elem1-elem2;}
function deMayorAMenor(elem1, elem2) {return elem2-elem1;}
</script>
</head>
<body><div id="cabecera"><h2>Cursos aprenderaprogramar.com</h2><h3>Ejemplos JavaScript</h3></div>
<div style="color:blue;" id ="pulsador" onclick="ejemplo()"> Probar </div>
</body>
</html>
El resultado esperado es:
El array original es: 1,4,2,9,11,44,111,7,4
Ordenado de mayor a menor es 111,44,11,9,7,4,4,2,1
Ordenado de menor a mayor es 1,2,4,4,7,9,11,44,111
© aprenderaprogramar.com, 2006-2029
Funciones predefinidas JavaScript para arrays.
EJERCICIO 1
Crea un script donde a partir del array [33, 2, 36, 55, 4, 1] se realicen los siguientes procesos:
a) Mostrar el array ordenado de menor a mayor y de mayor a menor usando la función sort y
definiendo la función de ordenación de forma anónima, es decir, deberás invocar X.sort(function (…) { …
} ) definiendo la función de forma anónima en vez de cómo función con nombre.
b) Crea una variable de nombre deMenorAMayor que contenga el resultado de ordenar de menor a
mayor los elementos del array.
c) Crea una variable de nombre deMayorAMenor que contenga el resultado de ordenar de mayor a
menor los elementos del array.
d) Muestra por pantalla el array original, la variable deMenorAMayor y la variable deMayorAMenor.
Para comprobar si tus respuestas y código son correctos puedes consultar en los foros
aprenderaprogramar.com.
EJERCICIO 2
Crea un script donde sea posible ordenar palabras por orden alfabético sin tener en cuenta la existencia
de mayúsculas o minúsculas. Por ejemplo, declarar var miArray=['Moto', 'soto', 'Abaco', 'abeja', 'Sapo',
'nieve', 'Zumba, 'barco'] y tras ordenar obtener =[ 'Abaco', 'abeja', 'barco', 'Moto', 'nieve', 'Sapo', 'soto',
'Zumba].
Para comprobar si tus respuestas y código son correctos puedes consultar en los foros
aprenderaprogramar.com.
Próxima entrega: CU01154E
Acceso al curso completo en aprenderaprogramar.com -- > Cursos, o en la dirección siguiente:
http://aprenderaprogramar.com/index.php?option=com_content&view=category&id=78&Itemid=206
© aprenderaprogramar.com, 2006-2029
Descargar