Aquí hay un artículo simple sobre algunos consejos sobre el uso de matrices JavaScript. Utilizaremos diferentes métodos para combinar/fusionar dos matrices JS, así como discutir las ventajas/desventajas de cada método.
Consideremos primero la siguiente situación:
La copia del código es la siguiente:
var a = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var b = ["foo", "bar", "baz", "bam", "bun", "diversión"];
Obviamente, el resultado de la combinación más simple debería ser:
La copia del código es la siguiente:
[
1, 2, 3, 4, 5, 6, 7, 8, 9,
"foo", "bar", "baz", "bam" "bun", "diversión"
]
concat (..)
Esta es la práctica más común:
La copia del código es la siguiente:
var c = a.concat (b);
a; // [1,2,3,4,5,6,7,8,9]
b; // ["foo", "bar", "baz", "bam", "bun", "diversión"]
do; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]]
Como puede ver, C es una matriz nueva que representa una combinación de dos matrices A y B y mantiene a A y B invariables. ¿Simple?
Pero si A tiene 10,000 elementos y B tiene 10,000 elementos? C tendrá 20,000 elementos, por lo que el uso de memoria de A y B se duplicará.
"¡Ningún problema!" Usted dijo. Permítales ser recolectados de basura, establecer A y B en nulo, ¡el problema se resuelve!
a = b = nulo; // 'A' y 'B' se recicla
jeje. Para matrices pequeñas con solo unos pocos elementos, esto está bien. Pero para matrices grandes, o sistemas con memoria limitada, este proceso debe repetirse con frecuencia, en realidad tiene muchas mejoras.
Inserción de bucle
Ok, copiemos el contenido de una matriz a otra, usando: Array#Push (..)
La copia del código es la siguiente:
// `b` en` a`
para (var i = 0; i <b.length; i ++) {
a.push (b [i]);
}
a; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]]
b = nulo;
Ahora, Array A tiene el contenido de la matriz b.
Parece haber una mejor huella de memoria.
Pero, ¿qué pasa si la matriz A es más pequeña? Por razones de memoria y velocidad, es posible que desee colocar más pequeño A frente a B,. No hay problema, solo cambie empuje (..) a desagular (..):
La copia del código es la siguiente:
// `a` en` b`:
para (var i = a.length-1; i> = 0; i--) {
b.unshift (a [i]);
}
b; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]]
Habilidades funcionales
Sin embargo, el bucle for es realmente feo y difícil de mantener. ¿Podemos hacerlo mejor?
Este es nuestro primer intento, usando la matriz#Reducir:
La copia del código es la siguiente:
// `b` en` a`:
a = b.reduce (función (coll, elemento) {
coll.push (elemento);
regresar coll;
}, a );
a; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]]
// o `a` en` b`:
b = A.Reduceright (function (coll, item) {
coll.unshift (ítem);
regresar coll;
}, b );
b; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]]
Array#Reduce (..) y la matriz#Reduceright (..) son agradables, pero son un poco torpes. La función de flecha de ES6 => reducirá la cantidad de código, pero aún requiere una función, y cada elemento debe llamarse una vez, lo cual no es perfecto.
Entonces, ¿qué tal esto?
La copia del código es la siguiente:
// `b` en` a`:
a.push.apply (a, b);
a; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]]
// o `a` en` b`:
B.unshift.Aply (b, a);
b; // [1,2,3,4,5,6,7,8,9, "Foo", "Bar", "Baz", "Bam", "Bun", "Fun"]]
¿Es este un lugar mucho mejor? Especialmente porque el método Unchift (..) no necesita preocuparse por la clasificación inversa anterior aquí. La operación del habla del ES6 será más hermosa: A.Push (... b) o B.unshift (... a
Límite de longitud máxima para la matriz
El primer problema importante es que el uso de la memoria se duplica (¡solo temporal, por supuesto!) Básicamente está copiando elementos en la pila a través de llamadas de funciones. Además, diferentes motores JS tienen limitaciones en la duración de los datos de copia.
Entonces, si la matriz tiene un millón de elementos, definitivamente estará más allá del límite que empuje (...) o desanimar (...) permite la pila de llamadas. Por desgracia, hará un gran trabajo al manejar miles de elementos, pero debe tener cuidado de no exceder el límite de longitud razonable.
Nota: Puede probar Splice (...), que tiene este problema como Push (...) y Unchift (...).
Hay una manera de evitar este límite de longitud máxima.
La copia del código es la siguiente:
función combineInto (a, b) {
var len = a.length;
para (var i = 0; i <len; i = i+5000) {
b.unshift.apply (b, a.slice (i, i+5000));
}
}
Espera, nuestra legibilidad se ha retrasado. Eso es todo, puede empeorar cada vez más, jaja.