objetos - javascript array methods

¿Cuál es la diferencia entre “Array()” y “[]” al declarar una matriz de JavaScript?

Question

¿Cuál es la diferencia real entre declarar una matriz como esta:

var myArray = new Array();

y

var myArray = [];

Answer 1

Como sé, la diferencia u puede encontrar la división (u otras funciones de Array) como code1. Y code2 muestran u Array y sus instancias :

código1:

[].slice; // find slice here
var arr = new Array();
arr.slice // find slice here
Array.prototype.slice // find slice here

código2:

[].__proto__ == Array.prototype; // true
var arr = new Array();
arr.__proto__ == Array.prototype; // true

conclusión:

Como puede ver [] y el new Array() crea una nueva instancia de Array. Y todos ellos obtienen las funciones de prototipo de Array.prototype

Solo son diferentes instancias de Array. Esto explica por qué [] != []

:)

Answer 2

El primero es el constructor de objetos predeterminado call.mostly utilizado para valores dinámicos.

var array = new Array(length); //initialize with default length

la segunda matriz se utiliza al crear valores estáticos

var array = [red, green, blue, yellow, white]; // this array will contain values.

Answer 3

El primero es la llamada del constructor de objetos por defecto. Puedes usar sus parámetros si quieres.

var array = new Array(5); //initialize with default length 5

El segundo te da la posibilidad de crear una matriz no vacía:

var array = [1, 2, 3]; // this array will contain numbers 1, 2, 3.

Answer 4

El uso del constructor Array crea una nueva matriz de la longitud deseada y llena cada uno de los índices con undefined, la matriz asignada a una variable crea los índices para los que le da información.

Answer 5

Hay una diferencia, pero no hay diferencia en ese ejemplo.

Usando el método más detallado: new Array() tiene una opción adicional en los parámetros: si le pasas un número al constructor, obtendrás una matriz de esa longitud:

x = new Array(5);
alert(x.length); // 5

Para ilustrar las diferentes formas de crear una matriz:

var a = [],            // these are the same
    b = new Array(),   // a and b are arrays with length 0

    c = [''foo'', ''bar''],           // these are the same
    d = new Array(''foo'', ''bar''),  // c and d are arrays with 2 strings

    // these are different:
    e = [3]             // e.length == 1, e[0] == 3
    f = new Array(3),   // f.length == 3, f[0] == undefined

;

Answer 6

Hay una gran diferencia que nadie menciona.

Podría pensar que la new Array(2) es equivalente a [undefined, undefined] antes porque tenemos

new Array(2).length           // 2
new Array(2)[0] === undefined // true
new Array(2)[1] === undefined // true

¡PERO NO LO ES!

Probemos map() :

[undefined, undefined].map(e => 1)  // [1, 1]
new Array(2).map(e => 1)            // "(2) [undefined × 2]" in Chrome

¿Ver? ¡Es diferente! Pero ¿por qué es eso?

De acuerdo con la especificación ES6 22.1.1.2, Array(len) solo crea una nueva matriz con una length establecida en len y nada más. Por lo tanto, no hay ningún elemento real dentro de la nueva matriz.

Mientras que la función map() , de acuerdo con la especificación 22.1.3.15 primero verificará HasProperty luego llamará la devolución de llamada, pero resulta que:

new Array(2).hasOwnProperty(0) // false
[undefined, undefined].hasOwnProperty(0) // true

Es por eso que no puede esperar que las funciones de iteración funcionen como de costumbre en una matriz creada a partir de una new Array(len) .

BTW, Safari y Firefox tienen una mejor expresión para esto:

// Safari
new Array(2)             // [](2)
new Array(2).map(e => 1) // [](2) 
[undefined, undefined]   // [undefined, undefined] (2) 

// Firefox
new Array(2)             // Array [ <2 empty slots> ]
new Array(2).map(e => 1) // Array [ <2 empty slots> ]
[undefined, undefined]   // Array [ undefined, undefined ]

Ya envié un problema a Chrome para pedirles que corrijan este registro confuso: https://bugs.chromium.org/p/chromium/issues/detail?id=732021

ACTUALIZACIÓN: ya está arreglado. Chrome ahora inicia sesión como

new Array(2)             // (2) [empty × 2]

Answer 7

He encontrado una diferencia entre las dos construcciones que me mordieron bastante fuerte.

Digamos que tengo:

function MyClass(){
  this.property1=[];
  this.property2=new Array();
};
var MyObject1=new MyClass();
var MyObject2=new MyClass();

En la vida real, si hago esto:

MyObject1.property1.push(''a'');
MyObject1.property2.push(''b'');
MyObject2.property1.push(''c'');
MyObject2.property2.push(''d'');

Lo que termino con esto es:

MyObject1.property1=[''a'',''c'']
MyObject1.property2=[''b'']
MyObject2.property1=[''a'',''c'']
MyObject2.property2=[''d'']

No sé qué se supone que suceda con la especificación de lenguaje, pero si quiero que mis dos objetos tengan matrices de propiedades únicas en mis objetos, tengo que usar la new Array() .

Answer 8

He incurrido en un comportamiento extraño usando [].

Tenemos "clases" de modelo con campos inicializados a algún valor. P.ej:

require([
  "dojo/_base/declare",
  "dijit/_WidgetBase",
], function(declare, parser, ready, _WidgetBase){

   declare("MyWidget", [_WidgetBase], {
     field1: [],
     field2: "",
     function1: function(),
     function2: function()
   });    
});

Descubrí que cuando los campos se inicializan con [] , todos los objetos del Modelo los compartirían. Hacer cambios en uno afecta a todos los demás.

Esto no sucede al inicializarlos con la new Array() . Lo mismo para la inicialización de objetos ( {} vs nuevo Object() )

TBH No estoy seguro de si es un problema con el marco que estábamos usando ( Dojo )

Answer 9

La diferencia de uso

var arr = new Array(size);

O

arr = [];
arr.length = size;

Como se ha discutido lo suficiente en esta pregunta.

Me gustaría agregar el problema de la velocidad: la forma más rápida actual en google chrome es la segunda.

Pero presta atención, estas cosas tienden a cambiar mucho con las actualizaciones. También el tiempo de ejecución será diferente entre los diferentes navegadores.

Por ejemplo, la segunda opción que mencioné, se ejecuta en 2 millones [ops / second] en chrome , pero si lo intentara en mozilla dev. obtendrías una tasa sorprendentemente más alta de 23 millones.

De todos modos, le sugiero que lo revise, de vez en cuando, en diferentes navegadores (y máquinas), utilizando el sitio jsperf.com/create-an-array-of-initial-size/2

Answer 10

La diferencia entre crear una matriz con la matriz implícita y el constructor de matriz es sutil pero importante.

Cuando creas una matriz usando

var a = [];

Le está diciendo al intérprete que cree una nueva matriz de tiempo de ejecución. No es necesario ningún procesamiento adicional. Hecho.

Si utiliza:

var a = new Array();

Le está diciendo al intérprete, quiero llamar al constructor " Array " y generar un objeto. Luego busca en el contexto de ejecución para encontrar el constructor al que llamar y lo llama, creando su matriz.

Puedes pensar: "Bueno, esto no importa en absoluto. ¡Son lo mismo!". Desafortunadamente no puedes garantizar eso.

Tomemos el siguiente ejemplo:

function Array() {
    this.is = ''SPARTA'';
}

var a = new Array();
var b = [];

alert(a.is);  // => ''SPARTA''
alert(b.is);  // => undefined
a.push(''Woa''); // => TypeError: a.push is not a function
b.push(''Woa''); // => 1 (OK)

En el ejemplo anterior, la primera llamada alertará ''SPARTA'' como se esperaría. El segundo no lo hará. Terminarás viendo indefinido. También notará que b contiene todas las funciones del objeto Array nativo, como push , donde el otro no.

Si bien puede esperar que esto suceda, solo ilustra el hecho de que [] no es lo mismo que la new Array() .

Probablemente sea mejor usar solo [] si sabes que solo quieres una matriz. Tampoco sugiero ir alrededor y redefinir Array ...

Answer 11

No hay una gran diferencia, básicamente hacen lo mismo pero lo hacen de diferentes maneras, pero sigue leyendo, mira esta declaración en el W3C:

var cars = ["Saab", "Volvo","BMW"];

y

var cars = new Array("Saab", "Volvo", "BMW");

Los dos ejemplos anteriores hacen exactamente lo mismo. No hay necesidad de usar un nuevo Array ().
Para simplicidad, legibilidad y velocidad de ejecución, use el primero (el método de matriz literal).

Pero al mismo tiempo, crear una nueva matriz utilizando la new Array sintaxis de new Array considera una mala práctica:

Evitar nueva matriz ()

No es necesario utilizar el nuevo generador de arreglos integrado de JavaScript (Array ()).
Utilice [] en su lugar.
Estas dos declaraciones diferentes crean una nueva matriz vacía llamada puntos:

var points = new Array();         // Bad
var points = [];                  // Good 

Estas dos declaraciones diferentes crean una nueva matriz que contiene 6 números:

var points = new Array(40, 100, 1, 5, 25, 10); // Bad    
var points = [40, 100, 1, 5, 25, 10];          // Good

La nueva palabra clave solo complica el código. También puede producir algunos resultados inesperados:

var points = new Array(40, 100);  // Creates an array with two elements (40 and 100)

¿Qué pasa si elimino uno de los elementos?

var points = new Array(40);       // Creates an array with 40 undefined elements !!!!!

Básicamente, no se considera como la mejor práctica, también hay una pequeña diferencia allí, puede pasar la longitud a una new Array(length) como esta, que tampoco es una forma recomendada.

Answer 12

Para entender mejor [] y la new Array() :

> []
  []
> new Array()
  []
> [] == []
  false
> [] === []
  false
> new Array() == new Array()
  false
> new Array() === new Array()
  false
> typeof ([])
  "object"
> typeof (new Array())
  "object"
> [] === new Array()
  false
> [] == new Array()
  false

El resultado anterior es de la consola de Google Chrome en Windows 7.

Answer 13

Para obtener más información, la siguiente página describe por qué nunca necesita usar una new Array()

Nunca necesitas usar un new Object() en JavaScript. Utilice el objeto literal {} lugar. Del mismo modo, no use la new Array() , use la matriz literal [] lugar. Los arreglos en JavaScript no funcionan como los arreglos en Java, y el uso de la sintaxis similar a Java lo confundirá.

No utilice un new Number new String , una new String new Boolean o un new Boolean . Estas formas producen envoltorios de objetos innecesarios. Solo usa literales simples en su lugar.

También revise los comentarios: el new Array(length) formulario de new Array(length) no tiene ningún propósito útil (al menos en las implementaciones actuales de JavaScript).

Answer 14

Por extraño que parezca, el new Array(size) es casi 2 veces más rápido que [] en Chrome, y aproximadamente el mismo en FF e IE (medido al crear y rellenar un array). Solo importa si conoces el tamaño aproximado de la matriz. Si agrega más elementos que la longitud que ha dado, se pierde el aumento de rendimiento.

Answer 15

Puedo explicar de una manera más específica comenzando con este ejemplo que se basa en el bueno de Fredrik.

var test1 = [];
test1.push("value");
test1.push("value2");

var test2 = new Array();
test2.push("value");
test2.push("value2");

alert(test1);
alert(test2);
alert(test1 == test2);
alert(test1.value == test2.value);

Acabo de agregar otro valor a las matrices e hice cuatro alertas: la primera y la segunda son para darnos el valor almacenado en cada matriz, para estar seguros de los valores. ¡Volverán igual! Ahora prueba el tercero, devuelve falso, eso es porque

JS trata a test1 como una VARIABLE con un tipo de datos de matriz , y trata a test2 como un OBJETO con la funcionalidad de una matriz , y aquí hay algunas pequeñas diferencias.

La primera diferencia es que cuando llamamos test1, llama a una variable sin pensar, simplemente devuelve los valores que se almacenan en esta variable sin tener en cuenta su tipo de datos. Pero, cuando llamamos test2, llama a la función Array () y luego almacena nuestros valores "Pushed" en su propiedad "Value" , y lo mismo sucede cuando alertamos a test2, devuelve la propiedad "Value" del objeto de array.

Entonces, cuando verificamos si test1 es igual a test2, por supuesto, nunca devolverán verdadero, uno es una función y el otro es una variable (con un tipo de matriz), ¡incluso si tienen el mismo valor!

Para estar seguro de eso, intente la cuarta alerta, con el .value agregado; volverá verdad En este caso, le decimos a JS "No tenga en cuenta el tipo de contenedor, ya sea función o variable, compare los valores que están almacenados en cada contenedor y díganos lo que ha visto". eso es exactamente lo que pasa.

Espero haber dicho la idea detrás de eso claramente, y lamento mi mal inglés.