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:
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:
[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:
var c = a.concat (b); a; // [1,2,3,4,5,6,7,8,9] b; // ["foo", "bar", "baz", "bam", "bun", "diversión"] c; // [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 (..)
// `b` en` a`For (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", "diversión"] 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 (..):
// `a` en` b`: for (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:
// `b` en` a`: a = b.reduce (function (coll, item) {coll.push (elemento); return coll;}, a); a; // [1,2,3,4,5,6,7,8,9, "foo", "bar", "baz", "bam", "bun", "diversión"] // o `a` en` b`: b = a.meduceright (function (coll, item) {coll.Unshift (item); return 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?
// `b` en` a`: a.push.apply (a, b); a; // [1,2,3,4,5,6,7,8,9, "foo", "bar", "baz", "bam", "bun", "diversión"] // o `a` en` b`: b.unshift.apply (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á fuera 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 el mismo problema que Push (...) y Deshift (...).
Hay una manera de evitar este límite de longitud máxima.
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. Solo así, puede empeorar cada vez más.
Lo anterior se trata de este artículo, espero que sea útil para todos aprender la programación de JavaScript.