Los Arreglos (Arrays)

Un arreglo (array) puede guardar varios datos.

Crear un Arreglo (Array)

Los Arreglos (Arrays) se crean con corchetes y los datos separados por comas (es una manera de hacerlo).

En el Código 61, a la variable ciudades se introduce tres ciudades, separadas por comas, creando un arreglo (array).

Copiar enlace:

Pegar enlace en la url del explorador web y descarga el archivo:

Código 61: Crear un Arreglo (Array)


<!DOCTYPE html>
<html>
<head>

<meta charset="UTF-8">

<title> Ejercicio </title>
</head>
<body>

<script>
// Variable array
var ciudades = ["Caracas", "Mérida", "Valera"];
// Imprimir por pantalla
document.write(ciudades);
</script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo061.html

En la Figura 57, el valor de la variable ciudades es “Caracas, Mérida, Valera”.

Figura 57 – Vista en el explorador Web

Código 61: Crear un Arreglo (Array)

Acceder a un elemento (ítem) de un Arreglo (Array)

Los elementos (ítems) de un arreglo (array) se puede acceder con un entero y el primer elemento (ítem) de un arreglo (array) comienza con el 0.

En el Código 62, la variable ciudades[0], se accede al primer elemento del arreglo ciudades[].

Descargar archivo codigo062.html

Código 62: Acceder a un elemento (ítem) de un Arreglo (Array)

<!DOCTYPE html>

<html>

<head>

<title> Ejercicio </title>

</head>

<body>

// Variable array

var ciudades = ["Caracas", "Mérida", "Valera"];

// Imprimir por pantalla

document.write(ciudades[0]);

</script>

</body>

</html>

Enlace: localhost/js_ajax_jquery/codigo062.html

En la Figura 58, el valor de la variable ciudades[0] es “Caracas”.

Figura 58 – Vista en el explorador Web

Código 62: Acceder a un elemento (ítem) de un Arreglo (Array)

Agregar elementos (ítems) a un Arreglo (Array) al final

El método push() agrega uno o más elementos (ítems) al final de un arreglo (array).

En el Código 63, con el métofo push(), se agrega un elemento al final del arreglo ciudades[].

Descargar archivo codigo063.html

Código 63: Agregar elementos (ítems) a un Arreglo (Array) al final

<!DOCTYPE html>

<html>

<head>

<title> Ejercicio </title>

</head>

<body>

// Variable array

var ciudades = ["Caracas", "Mérida", "Valera"];

// Agregar un elemento al final del array

ciudades.push("Valencia");

// Imprimir por pantalla

document.write(ciudades);

</script>

</body>

</html>

Enlace: localhost/js_ajax_jquery/codigo063.html

En la Figura 59, el valor de la variable ciudades es “Caracas, Mérida, Valera, Valencia”.

Figura 59 – Vista en el explorador Web

Código 63: Agregar elementos (ítems) a un Arreglo (Array) al final

Agregar elementos (ítems) a un Arreglo (Array) al inicio

El método unshift() agrega uno o más elementos (ítems) al inicio de un arreglo (array).

En el Código 64, con el métofo unshift(), se agrega un elemento al comienzo del arreglo ciudades[].

Descargar archivo codigo064.html

Código 64: Agregar elementos (ítems) a un Arreglo (Array) al inicio

<!DOCTYPE html>

<html>

<head>

<title> Ejercicio </title>

</head>

<body>

// Variable array

var ciudades = ["Caracas", "Mérida", "Valera"];

// Agregar un elemento al inicio al array

ciudades.unshift("Maracay");

// Imprimir por pantalla

document.write(ciudades);

</script>

</body>

</html>

Enlace: localhost/js_ajax_jquery/codigo064.html

En la Figura 60, el valor de la variable ciudades es “Maracay, Caracas, Mérida, Valera”.

Figura 60 – Vista en el explorador Web

Código 64: Agregar elementos (ítems) a un Arreglo (Array) al inicio

Remover el último elemento (ítem) a un Arreglo (Array)

El método pop() remueve el último elemento (item) de un arreglo (array).

En el Código 65, con el métofo pop(), se elimina un elemento el último del arreglo ciudades[].

Descargar archivo codigo065.html

Código 65: Remover el último elemento (ítem) a un Arreglo (Array)

<!DOCTYPE html>

<html>

<head>

<title> Ejercicio </title>

</head>

<body>

// Variable array

var ciudades = ["Caracas", "Mérida", "Valera"];

// Eliminar el último elemento del array

ciudades.pop();

// Imprimir por pantalla

document.write(ciudades);

</script>

</body>

</html>

Enlace: localhost/js_ajax_jquery/codigo065.html

En la Figura 61, el valor de la variable ciudades es “Caracas, Mérida”.

Figura 61 – Vista en el explorador Web

Código 65: Remover el último elemento (ítem) a un Arreglo (Array)

Remover el primer elemento (ítem) a un Arreglo (Array)

El método shift() remueve el primer elemento (item) de un arreglo (array).

En el Código 66, con el métofo shift(), se elimina un elemento el primero del arreglo ciudades[].

Descargar archivo codigo066.html

Código 66: Remover el primer elemento (ítem) a un Arreglo (Array)

<!DOCTYPE html>

<html>

<head>

<title> Ejercicio </title>

</head>

<body>

// Variable array

var ciudades = ["Caracas", "Mérida", "Valera"];

// Eliminar el primer elemento del array

ciudades.shift();

// Imprimir por pantalla

document.write(ciudades);

</script>

</body>

</html>

Enlace: localhost/js_ajax_jquery/codigo066.html

En la Figura 62, el valor de la variable ciudades es “Mérida, Valera”.

Figura 62 – Vista en el explorador Web

Código 66: Remover el primer elemento (ítem) a un Arreglo (Array)

Obtener el número de elementos de un Arreglo (Array)

La propiedad lenght obtiene el número de elementos de un arreglo (array).

En el Código 67, con el métofo length, obtiene el número de elementos del arreglo ciudades[ ].

Descargar archivo codigo067.html

Código 67: Obtener el número de elementos de un Arreglo (Array)

<!DOCTYPE html>

<html>

<head>

<title> Ejercicio </title>

</head>

<body>

// Variable array

var ciudades = ["Caracas", "Mérida", "Valera"];

// Obtener el número de elementos

var nro_elementos = ciudades.length;

// Imprimir por pantalla

document.write(nro_elementos);

</script>

</body>

</html>

Enlace: localhost/js_ajax_jquery/codigo067.html

En la Figura 63, el valor de la variable nro_elementos es 3.

Figura 63 – Vista en el explorador Web

Código 67: Obtener el número de elementos de un Arreglo (Array)

Acceder el último de elementos de un Arreglo (Array)

Para acceder al último elemento de un arreglo (array) se resta 1 a su length.

En el Código 68, con el métofo length menos 1, obtiene el último elemento del arreglo ciudades[].

Descargar archivo codigo068.html

Código 68: Acceder el último de elementos de un Arreglo (Array)

<!DOCTYPE html>

<html>

<head>

<title> Ejercicio </title>

</head>

<body>

// Variable array

var ciudades = ["Caracas", "Mérida", "Valera"];

// Obtener el utimo elemento

var ultimo_elemento = ciudades[ciudades.length - 1];

// Imprimir por pantalla

document.write(ultimo_elemento);

</script>

</body>

</html>

Enlace: localhost/js_ajax_jquery/codigo068.html

En la Figura 64, el valor de la variable ultimo_elemento es “Valera”.

Figura 64 – Vista en el explorador Web

Código 68: Acceder el último de elementos de un Arreglo (Array)

El for() en un Arreglo (Array)

Con el for() se puede acceder a los elementos de un arreglo (array).

En el Código 69, con el métofo for(), obtiene todo los elementos del arreglo ciudades[].

Descargar archivo codigo069.html

Código 69: El for() en un Arreglo (Array)


<!DOCTYPE html>
<html>
<head>
   
   <meta charset="UTF-8">
   
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Variable array
      // Variable array
      var ciudades = ["Caracas", "Mérida", "Valera", "Vigía", "Maracay"];
      // Obtener los elementos
      for(var i = 0; i < ciudades.length; i++)
      {
        // Imprimir por pantalla
         document.write(ciudades[i]);
         // Salto de línea
         document.write("<br/>");
      }
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo069.html

   En la Figura 65, el valor de la variable cuidades[ ] es “Caracas, Mérida, Valera, Vigía, Maracay”.

Figura 65 – Vista en el explorador Web
Código 69: El for() en un Arreglo (Array)

Pasar de cadena de Caracteres (string) a un arreglo (array)

Para convertir una cadena de caracteres (string) a un arreglo (array) se usa el método Split(), el método Split() toma una separador dentro de una cadena de caracteres (string).

En el Código 70, con el método split(), convierte la cadena de caracteres (string) de la variable cadena a la variable arreglo[ ].

Descargar archivo codigo070.html

Código 70: Pasar de cadena de Caracteres (string) a un arreglo (array)


<!DOCTYPE html>
<html>
<head>
   
   <meta charset="UTF-8">
   
   <title> Ejercicio </title>
</head>
<body>
   <script>
      // Variable string, fecha
      var cadena = "01-03-2023";
      // Obtener la fecha por partes
      var arreglo = cadena.split("-");
      // Imprimir por pantalla
      document.write("Día:" + arreglo[0]);
      document.write( "<br/>");
      document.write("Mes:" + arreglo[1]);
      document.write( "<br/>");
      document.write("Año:" + arreglo[2]);
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo070.html

   En la Figura 66, el valor de la variable arreglo[ ] es “01, 02, 2023”.

Figura 66 – Vista en el explorador Web
Código 70: Pasar de cadena de Caracteres (string) a un arreglo (array)

Unir Arreglos (Arrays)

El método concat() une dos o más arreglos (arrays).

En el Código 71, con el método concat() une los arreglos (arrays) frutas1[],frutas2[] y frutas3[] y lo asigna al arreglo (array).

Descargar archivo codigo071.html

Código 71: Unir Arreglos (Arrays)


<!DOCTYPE html>
<html>
<head>
   
   <meta charset="UTF-8">
   
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglos
      var frutas1 = ["Banana","Manzana"];
      var frutas2 = ["Naranja","Uva"];
      var frutas3 = ["Fresas","Mango"];
      // Unir arreglos
      var frutas = frutas1.concat(frutas2, frutas3);
      // Imprimir por pantalla
      document.write(frutas);
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo071.html

En la Figura 67, el valor de la variable frutas[ ] es “Banana, Manzana, Naranja, Uva, Fresas, Mango”.

Figura 67 – Vista en el explorador Web
Código 71: Unir Arreglos (Arrays)

Buscar un Índice (item) de un Arreglo (Array)

El método indexOf() returna el índice de la primera ocurrencia de un elemento en un arreglo (array).

En el Código 72, con el método método indexOf(), se sabe el índice del elemento “Naranja” del arreglo (array) frutas[].

Descargar archivo codigo072.html

Código 72: Buscar un Índice (item) de un Arreglo (Array)


<!DOCTYPE html>
<html>
<head>
   
   <meta charset="UTF-8">
   
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var frutas = ["Banana","Manzana","Naranja","Uva"];
      // Buscar un índice
      var i = frutas.indexOf("Naranja");
      // Imprimir por pantalla
      document.write(i);
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo072.html

En la Figura 68, el valor de la variable i es 2 que es el índice de “Naranja”.

Figura 68 – Vista en el explorador Web
Código 72: Buscar un Índice (item) de un Arreglo (Array)

Chequear si Existe un Valor en un Arreglo (Array)

Para chequear si un valor existe en el arreglo, se usa el método includes(), el método includes() retorna verdadero si un valor está en el arreglo.

En el Código 73, con el método includes(), se sabe si existe el elemento "Valencia" en el arreglo (array) ciudades[ ].

Descargar archivo codigo073.html

Código 73: Chequear si Existe un Valor en un Arreglo (Array)


<!DOCTYPE html>
<html>
<head>
   
   <meta charset="UTF-8">
   
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var ciudades = ["Caracas","Valencia","Maracay"];
      // Si está Valencia en el arreglo
      var x = ciudades.includes("Valencia");
      // Imprimir por pantalla
      document.write(x);
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo073.html

En la Figura 69, el valor de la variable x es True porque el valor “Valencia” está incluido en el arreglo.

Figura 69 – Vista en el explorador Web
Código 73: Chequear si Existe un Valor en un Arreglo (Array)

Remover un Índice (Item) de un Arreglo (Array)

El método splice() puede ser usado para remover un índice (ítem.).

En el Código 74, el método splice(), remueve el mes de Marzo de la variable meses.

Descargar archivo codigo074.html

Código 74: Remover un Índice (Item) de un Arreglo (Array)


<!DOCTYPE html>
<html>
<head>

   <meta charset="UTF-8">

   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var meses = ["Enero","Febrero","Marzo","Abril"];
      // Remueve el índice 2 que tiene el valor de Marzo
      meses.splice(2,1);
      // Imprimir por pantalla
      document.write(meses);
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo074.html

En la Figura 70, el valor de la variable meses es “Enero, Febrero, Abril”.

Figura 70 – Vista en el explorador Web
Código 74: Remover un Índice (Item) de un Arreglo (Array)

Reemplazar el Valor de un Índice (Item) de un Arreglo (Array)

Para reemplazar el valor de un arreglo se usa el índice de ese valor.

En el Código 75, con el índice 2 de la variable meses se puede reemplazar el mes de Marzo con el mes de Diciembre.

Descargar archivo codigo075.html

Código 75: Reemplazar el Valor de un Índice (Item) de un Arreglo (Array)


<!DOCTYPE html>
<html>
<head>
   
   <meta charset="UTF-8">
   
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var meses = ["Enero","Febrero","Marzo"];
      // Cambia el valor del índice 2
      meses[2] = "Diciembre";
      // Imprimir por pantalla
      document.write(meses);
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo075.html

   En la Figura 71, el valor de la variable meses es “Enero, Febrero, Diciembre”.

Figura 71 – Vista en el explorador Web
Código 75: Reemplazar el Valor de un Índice (Item) de un Arreglo (Array)

Ordenar los Elementos de un Arreglo en Orden Ascendente (Array)

El método sort() ordena los elementos de un arreglo (array) en orden ascendente.

En el Código 76, con el método método sort(), ordena los elementos de la variable fruta en orden ascendente, la variable fruta es un arreglo (array).

Descargar archivo codigo076.html

Código 76: Ordenar los Elementos de un Arreglo en Orden Ascendente (Array)


<!DOCTYPE html>
<html>
<head>
   
   <meta charset="UTF-8">
   
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var frutas = ["Bananas","Manzanas","Durazno","Fresas"];
      // Ordenar los elementos del array en orden ascendente
      frutas.sort();
      // Imprimir por pantalla
      document.write(frutas);
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo076.html

   En la Figura 72, el valor de la variable frutas es “Bananas, Durazno, Fresas, Manzanas”.

Figura 72 – Vista en el explorador Web
Código 76: Ordenar los Elementos de un Arreglo en Orden Ascendente (Array)

Ordenar los Números de un Arreglo (Array) en Orden Ascendente

Para ordenar los números de un arreglo, se usa el método sort() y la función de comparación.

En el Código 77, con el método sort() y la función comparar, ordena los números de la vaiable números en orden ascendente, la variable numeros es un arreglo (array).

Descargar archivo codigo077.html

Código 77: Ordenar los Números de un Arreglo (Array) en Orden Ascendente


<!DOCTYPE html>
<html>
<head>
   
   <meta charset="UTF-8">
   
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var numeros = [5, 3, 4, 1, 2];
      // Ordena los números en orden ascendente
      numeros.sort(comparar);
      // Imprimir por pantalla
      document.write(numeros);
      // Función comparación
      function comparar(a, b){
         return a - b;
      };
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo077.html

   En la Figura 73, los valores de la variable números es “1,2,3,4,5” en orden ascendente.

Figura 73 – Vista en el explorador Web
Código 77: Ordenar los Números de un Arreglo (Array) en Orden Ascendente

Ordenar los Números de un Arreglo (Array) en Orden Descendente

Para ordenar los números de un arreglo, se usa una función de comparación.

En el Código 78, con el método sort() y la función comparar, ordena los números de la vaiable números en orden descendente, la variable numeros es un arreglo (array).

Descargar archivo codigo078.html

Código 78: Ordenar los Números de un Arreglo (Array) en Orden Descendente


<!DOCTYPE html>
<html>
<head>
   
   <meta charset="UTF-8">
   
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var numeros = [5, 3, 4, 1, 2];
      // Ordena los números en orden descendente
      numeros.sort(comparar);
      // Imprimir por pantalla
      document.write(numeros);
      // Función ordenar
      function comparar(a, b) {
         return b - a;
      };
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo078.html

   En la Figura 74, los valores de la variable números es “5,4,3,2,1” en orden descendente.

Figura 74 – Vista en el explorador Web
Código 78: Ordenar los Números de un Arreglo (Array) en Orden Descendente

Obtener el Valor más Alto (Highest) de un Arreglo (Array)

Para obtener el valor más alto de un arreglo de números, se ordena los números en orden descendente en el arreglo.

En el Código 79, con el método sort() y la función comparar, ordena los números de la vaiable números en orden descendente, la variable numeros es un arreglo (array), en la variable números, el elemento de índice 0 de la variable números, es el número mayor.

Descargar archivo codigo079.html

Código 79: Obtener el Valor más Alto (Highest) de un Arreglo (Array)


<!DOCTYPE html>
<html>
<head>
     
   <meta charset="UTF-8">
     
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var numeros = [4, 3, 5, 1, 2];
      // Ordena los números en orden descendente
      numeros.sort(comparar);
      // Obtener el número más alto
      var valor_mas_alto = numeros[0];
      // Imprimir por pantalla
      document.write(valor_mas_alto);
      // Función ordenar
      function comparar(a, b) {
         return b - a;
      };
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo079.html

   En la Figura 75, el valor de la variable valor_mas_alto es 5, que el número mayor.

Figura 75 – Vista en el explorador Web
Código 79: Obtener el Valor más Alto (Highest) de un Arreglo (Array)

Obtener el Valor más Bajo (Lowest) de un Arreglo (Array)

Para obtener el valor más bajo de un arreglo de números, se ordena los números en orden ascendente en el arreglo (array).

En el Código 80, con el método sort() y la función comparar, ordena los números de la vaiable números en orden ascendente, la variable numeros es un arreglo (array), en la variable números, el elemento de índice 0 de la variable números, es el número menor.

Descargar archivo codigo080.html

Código 80: Obtener el Valor más Bajo (Lowest) de un Arreglo (Array)


<!DOCTYPE html>
<html>
<head>
   
   <meta charset="UTF-8">
   
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var numeros = [5, 3, 4, 1, 2];
      // Ordena los números en orden ascendente
      numeros.sort(comparar);
      // Obtener el número más bajo
      var valor_mas_bajo = numeros[0];
      // Imprimir por pantalla
      document.write(valor_mas_bajo);
      // Función ordenar
      function comparar(a, b) {
         return a - b;
      };
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo080.html

   En la Figura 76, el valor de la variable valor_mas_bajo es 1.

Figura 76 – Vista en el explorador Web
Código 80: Obtener el Valor más Bajo (Lowest) de un Arreglo (Array)

Reversar los Elementos de un Arreglo (Array)

Para reversar el orden de los elementos de un arreglo se usa el método reverse().

En el Código 81, se reversa los elementos de un arreglo (array) que es la variable frutas.

En el Código 81, con el método reverse(), reversa los elementos de la variable frutas que un arreglo (array).

Descargar archivo codigo081.html

Código 81: Reversar los Elementos de un Arreglo (Array)


<!DOCTYPE html>
<html>
<head>
     
     <meta charset="UTF-8">
     
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var frutas = ["Manzanas", "Bananas", "Naranjas", "Limones"];
      // Resversar el array
      frutas.reverse();
      // Imprimir por pantalla
      document.write(frutas);
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo081.html

   En la Figura 77, el valor de la variable frutas es “Limones, Naranjas, Bananas, Manzanas”.

Figura 77 – Vista en el explorador Web
Código 81: Reversar los Elementos de un Arreglo (Array)

Iteraciones de un Arreglo (Array)

Las iteraciones de un arreglo son operaciones para acceder a cada elemento de un arreglo (array).
.
El Lazo Repita para (For)

El Lazo Repita para (for) se puede obtener cada elemento de un arreglo (array).

En el Código 82, el Lazo Repita para (for) obtiene los elementos de la variable frutas y lo imprime con la instrucción document.write().

Descargar archivo codigo082.html

Código 82: El Lazo Repita para (For)


<!DOCTYPE html>
<html>
<head>
     
     <meta charset="UTF-8">
     
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var frutas = ["Manzanas", "Bananas", "Naranjas", "Limones"];
      // El lazo for para iterar
      for(var i = 0; i < frutas.length; i++) {
         // Imprimir por pantalla
         document.write(frutas[i] + "</br>")
      }
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo082.html

   En la Figura 78, el valor de la variables: frutas[0] es “Manzanas”, frutas[1] es “Bananas”, frutas[2] es “Naranjas” y frutas[3] es “Limones”.

Figura 78 – Vista en el explorador Web
Código 82: El Lazo Repita para (For)

El Método forEach en un Arreglo (Array)

El Método forEach accede a un elemento del arreglo (array), invocando a una función.

En el Código 83, el método forEach obtiene los elementos de la variable frutas que es un arrglo (array) y lo imprime con la instrucción document.write().

Descargar archivo codigo083.html

Código 83: El Método forEach en un Arreglo (Array)


<!DOCTYPE html>
<html>
<head>
     
     <meta charset="UTF-8">
     
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var frutas = ["Manzanas", "Bananas", "Naranjas", "Limones"];
      // Método forEach para iterar
      frutas.forEach(obtener_valor);
      // Función obtener valor
      function obtener_valor(frutas_2) {
            document.write(frutas_2 + "</br>");
      }
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo083.html

   En la Figura 79, el valor de la variable frutas_2: frutas_2 es “Manzanas”, frutas_2 es “Bananas”, frutas_2 es “Naranjas” y frutas_2 es “Limones”.

Figura 79 – Vista en el explorador Web
Código 83: El Método forEach en un Arreglo (Array)

El método map() en un Arreglo (Array)

El método map() crea un nuevo arreglo (array) con valores calculados con los valores del arreglo (array) actual.

En el Código 84, con el método map, duplico los valores de la vauiable numeros que es un arreglo (array) y se introduzce en la variable numeros_dobles que es una arreglo (array).

Descargar archivo codigo084.html

Código 84: El método map() en un Arreglo (Array)


<!DOCTYPE html>
<html>
<head>
     
     <meta charset="UTF-8">
     
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var numeros = [10, 20, 30, 40, 50];
      // Método map
      var numeros_dobles = numeros.map(obtener_valor);
      // Imprimir en pantalla
      document.write(numeros_dobles);
      // Función obtener valor
      function obtener_valor(numero) {
         return numero * 2;
      }
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo084.html

   En la Figura 80, el valor de la variable numero: numero es 20, numero es 40, numero es 60, numero es 80 y numero es 100.

Figura 80 – Vista en el explorador Web
Código 84: El método map() en un Arreglo (Array)

El método filter() en un Arreglo (Array)

El método filter crea un nuevo arreglo con los elementos que pasa de acuerdo con la condición de la función.

En el Código 85, con el método filter, obtengo los números menores a cuatro (4) de la variable numeros que es un arreglo (array) y se introduzce en la variable numeros_filtrados que es una arreglo (array).

Descargar archivo codigo085.html

Código 85: El método filter() en un Arreglo (Array)


<!DOCTYPE html>
<html>
<head>
     
     <meta charset="UTF-8">
     
   <title> Ejercicio </title>
</head>
<body>
   
   <script>
      // Arreglo
      var numeros = [1, 2, 3, 4, 5];
      // Método filter
      var numeros_filtrados = numeros.filter(obtener_valor);
      // Imprimir en pantalla
      document.write(numeros_filtrados);
      // Función filtrar número
      function obtener_valor(numero) {
         return numero < 4;
      }
   </script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo085.html

   En la Figura 81, el valor de la variable numero: numero es 1, numero es 2 y numero es 3.

Figura 81 – Vista en el explorador Web
Código 85: El método filter() en un Arreglo (Array)

Buscar este blog

Conceptos Básicos de JavaScript

Los Arreglos (Arrays)

Comentarios

Publicar un comentario

Entradas populares de este blog

Conceptos Básicos de JavaScript