Me he encontrado mucho con el término "Objeto tipo matriz" en JavaScript. ¿Qué es? ¿Cuál es la diferencia entre él y una matriz normal? ¿Cuál es la diferencia entre un objeto tipo matriz y un objeto normal?
¿Qué es?
Un objeto que tiene una propiedad de longitud de un entero no negativo y, por lo general, algunas propiedades indexadas. Por ejemplo
var ao1 = {length: 0}, // like [] ao2 = {0: 'foo', 5: 'bar', length: 6}; // like ["foo", undefined × 4, "bar"] Puede convertir Objetos tipo Array a sus contrapartes de Array usando Array.prototype.slice
var arr = Array.prototype.slice.call(ao1); // []¿Cuál es la diferencia entre él y una matriz normal?
No está construido por Array o con un Array literal [] , por lo que (generalmente) no se heredará de Array.prototype . Por lo general, la propiedad de longitud tampoco se actualizará automáticamente.
ao1 instanceof Array; // false ao1[0] = 'foo'; ao1.length; // 0, did not update automatically¿Cuál es la diferencia entre un objeto tipo matriz y un objeto normal?
No hay diferencia. Incluso las matrices normales son objetos en JavaScript
ao1 instanceof Object; // true [] instanceof Object; // trueLa famosa HTMLCollection (documentación ) y los arguments ( documentación ) son objetos tipo matriz que se crean automáticamente.
Algunas diferencias rápidas similares a matrices (por ejemplo HTMLCollection ) entre ejemplos de matrices reales:
var realArray = ['value1', 'value2']; var arrayLike = document.forms;similitudes:
El captador de longitud es el mismo:
arrayLike.length; // returns 2; realArray.length; // returns 2; //there are 2 forms in the DOM.El captador indexado es el mismo:
arrayLike[0]; // returns an element. realArray[0]; // returns an element. ('value') Ambos son objects :
typeof arrayLike; // returns "object" typeof realArray; // returns "object"Diferencias:
En arreglos como join() , concat() , include( includes() etc., los métodos no son funciones:
arrayLike.join(", "); // returns Uncaught TypeError: arrayLike.join is not a function (also relevant to `concat()`, `includes()` etc.) realArray.join(", "); // returns "value1, value2"La matriz como no es realmente una matriz:
Array.isArray(arrayLike); //returns "false" Array.isArray(realArray); //returns "true"En una matriz como si no pudieras establecer la propiedad de longitud:
arrayLike.length = 1; arrayLike.length; //return 2; //there are 2 forms in the DOM. realArray.length = 1; realArray.length; //return 1;Para empezar, una matriz es un objeto especializado. Especializado en eso:
[ … ]length que se actualiza automáticamenteLa otra característica obvia es que todos los elementos tienen un índice numérico.
Desde el punto de vista de JavaScript, cualquier objeto que tenga una propiedad de length está lo suficientemente cerca como para ser considerado como un objeto tipo matriz:
var arrayLikeObject = { length: 3, name: 'thing', '1': 'hello' }; console.log(arrayLikeObject); La propiedad de length no tiene que ser correcta. Incluso en una matriz normal, es posible forzar que la length sea diferente al número de elementos reales. Todos los elementos que faltan devuelven undefined .
Puede convertir un objeto similar a una matriz en una matriz real utilizando Array.from() . Esta función tomará varios valores, pero el más simple es algo como:
var arrayLikeObject = { length: 3, name: 'thing', '1': 'hello' }; var array = Array.from(arrayLikeObject); console.log(array); A partir de aquí, la matriz tiene todas las propiedades y métodos habituales. En el ejemplo anterior, la propiedad [1] se copia en la nueva matriz, pero el elemento [name] no, ya que no pertenece a una matriz real.
La función Array.from() también acepta una función de mapeo como segundo parámetro. Esto le permite realizar cualquier cambio que necesite en tránsito:
var arrayLikeObject = { length: 3, name: 'thing', '1': 'hello' }; var array = Array.from(arrayLikeObject, (element,index) => element?element.toUpperCase():`Item ${index}` ); console.log(array);