Tenemos una array grande y queremos dividirla en partes. Así que estos son algunos de los métodos para hacerlo.
- splice()
Este método agrega/elimina elementos a/de una array y devuelve la lista de elementos eliminados.
Sintaxis:array.splice(index, number, item1, ....., itemN)
Parámetros:
- índice: Este parámetro es obligatorio. Especifica el número entero en qué posición agregar/eliminar elementos. Los valores negativos son útiles para especificar la posición desde el final.
- número: Este parámetro es opcional. Especifica el número de elementos que se eliminarán. 0 significa que no hay nada que eliminar.
- item1, ….., itemN: Este parámetro es opcional. Esto especifica los nuevos elementos que se agregarán a la array.
Valor devuelto:
Devuelve un nuevo Array, con los elementos eliminados. - slice()
Este método devuelve una nueva array que contiene los elementos seleccionados.
Este método selecciona los elementos que comienzan desde el argumento de inicio dado y terminan en, pero excluyendo, el argumento de fin dado.
Sintaxis:array.slice(start, end)
Parámetros:
- Inicio: este parámetro es opcional. Especifica el entero desde donde comenzar la selección (el primer elemento está en el índice 0). Los números negativos se utilizan para seleccionar desde el final de la array. Si no se usa, actúa como “0”
- fin: Este parámetro es opcional. Especifica el entero desde donde terminar la selección. Si no se usa, todos los elementos desde el principio hasta el final de la array se incluirán en la selección. Los números negativos se utilizan para seleccionar desde el final.
Valor devuelto:
Devuelve un nuevo Array, con los elementos seleccionados.
Ejemplo-1: Este ejemplo usa el método slice() para dividir la array en partes de la array. Este método se puede usar repetidamente para dividir una array de cualquier tamaño.
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript
| Split array into chunks.
</title>
</head>
<body style="text-align:center;"
id="body">
<h1 style="color:green;">
GeeksForGeeks
</h1>
<p id="GFG_UP" style="font-size: 16px;">
</p>
<button onclick="gfg_Run()">
click here
</button>
<p id="GFG_DOWN" style="color:green;
font-size: 20px;
font-weight: bold;">
</p>
<script>
var el_up = document.getElementById("GFG_UP");
var el_down = document.getElementById("GFG_DOWN");
var i, j, chunk = 4;
var array = [1, 2, 3, 4, 5, 6, 7, 8];
el_up.innerHTML = array;
function gfg_Run() {
var array1 =
array.slice(0, chunk);
var array2 =
array.slice(chunk, chunk + array.length);
el_down.innerHTML = array1 + ' and ' + array2;
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Ejemplo-2: Este ejemplo usa el método splice() para dividir la array en partes de la array. Este método elimina los elementos de la array original. Este método se puede usar repetidamente para dividir una array de cualquier tamaño.
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript
| Split array into chunks.
</title>
</head>
<body style="text-align:center;"
id="body">
<h1 style="color:green;">
GeeksForGeeks
</h1>
<p id="GFG_UP" style="font-size: 16px;">
</p>
<button onclick="gfg_Run()">
click here
</button>
<p id="GFG_DOWN" style="color:green;
font-size: 20px;
font-weight: bold;">
</p>
<script>
var el_up = document.getElementById("GFG_UP");
var el_down = document.getElementById("GFG_DOWN");
var i, j, chunk = 2;
var array = [1, 2, 3, 4, 5, 6, 7, 8];
el_up.innerHTML = array;
function gfg_Run() {
var array1 = array.splice(0, chunk);
var array2 = array.splice(0, chunk);
var array3 = array.splice(0, chunk);
var array4 = array.splice(0, chunk);
el_down.innerHTML = array1 + ' | '
+ array2 + ' | '
+ array3 + ' | '
+ array4;
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Publicación traducida automáticamente
Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA