Qual é a diferença entre “Array ()” e “” ao declarar uma matriz JavaScript?

Qual é a diferença real entre declarar um array assim:

var myArray = new Array(); 

e

 var myArray = []; 

   

Há uma diferença, mas não há diferença nesse exemplo.

Usando o método mais detalhado: new Array() tem uma opção extra nos parâmetros: se você passar um número para o construtor, você receberá um array desse comprimento:

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

Para ilustrar as diferentes maneiras de criar uma 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 ; 

A diferença entre criar uma matriz com a matriz implícita e o construtor da matriz é sutil, mas importante.

Quando você cria um array usando

 var a = []; 

Você está dizendo ao interpretador para criar uma nova matriz de tempo de execução. Nenhum processamento extra é necessário. Feito.

Se você usar:

 var a = new Array(); 

Você está dizendo ao interpretador, eu quero chamar o construtor ” Array ” e gerar um object. Em seguida, ele procura pelo contexto de execução para localizar o construtor para chamar e chama-o, criando sua matriz.

Você pode pensar “Bem, isso não importa em nada. Eles são os mesmos!” Infelizmente você não pode garantir isso.

Tome o seguinte exemplo:

 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) 

No exemplo acima, a primeira chamada alertará “SPARTA” como seria de esperar. O segundo não. Você vai acabar vendo indefinido. Você também notará que b contém todas as funções nativas do object Array, como push , onde o outro não.

Enquanto você pode esperar que isso aconteça, isso apenas ilustra o fato de que [] não é o mesmo que o new Array() .

Provavelmente é melhor usar apenas [] se você sabe que quer apenas uma matriz. Eu também não sugiro ir ao redor e redefinir Array …

Curiosamente, o new Array(size) é quase 2x mais rápido que o [] no Chrome, e quase o mesmo em FF e IE (medido pela criação e preenchimento de um array). Só importa se você souber o tamanho aproximado da matriz. Se você adicionar mais itens do que o comprimento que você deu, o aumento de desempenho será perdido.

Para obter mais informações, a página a seguir descreve por que você nunca precisa usar o new Array()

Você nunca precisa usar o new Object() em JavaScript. Use o literal do object {} . Da mesma forma, não use new Array() , use o array literal [] . As matrizes em JavaScript não funcionam como as matrizes em Java, e o uso da syntax semelhante a Java irá confundi-lo.

Não use new Number , new String ou new Boolean . Esses formulários produzem invólucros de objects desnecessários. Apenas use literais simples.

Confira também os comentários – o new Array(length) formulário new Array(length) não serve para nenhuma finalidade útil (pelo menos nas implementações atuais de JavaScript).

Há uma diferença enorme que ninguém mencionou.

Você pode pensar que o new Array(2) é equivalente a [undefined, undefined] antes porque temos

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

MAS ISSO NÃO!

Vamos tentar o map() :

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

Vejo? É diferente! Mas por que isso?

De acordo com a ES6 Spec 22.1.1.2, Array(len) cria apenas uma nova matriz com length definido como len e nada mais. Assim, não há nenhum elemento real dentro da nova matriz.

Embora o map() funções map() , de acordo com a especificação 22.1.3.15, verifique primeiro HasProperty , chame o retorno de chamada, mas verifica-se que:

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

É por isso que você não pode esperar que quaisquer funções de iteração funcionem como de costume para o array criado a partir do new Array(len) .

BTW, Safari e Firefox têm uma expressão muito melhor para isso:

 // 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 ] 

Já enviei um problema ao Chrome para pedir que ele corrija esse log confuso: https://bugs.chromium.org/p/chromium/issues/detail?id=732021

ATUALIZAÇÃO: já está consertado. Chrome agora log como

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

Para entender melhor [] e 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 

O resultado acima é do console do Google Chrome no Windows 7.

A primeira é a chamada de construtor de object padrão. Você pode usar seus parâmetros se quiser.

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

O segundo lhe dá a capacidade de criar um array não vazio:

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

Eu posso explicar de uma maneira mais específica, começando com este exemplo que é baseado no bom 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); 

Acabei de adicionar outro valor aos arrays e fiz quatro alertas: O primeiro e o segundo são para nos fornecer o valor armazenado em cada array, para ter certeza sobre os valores. Eles vão devolver o mesmo! Agora tente o terceiro, ele retorna falso, isso é porque

O JS trata o test1 como um VARIABLE com um tipo de dados array , e trata o test2 como um OBJECT com a funcionalidade de um array , e há poucas pequenas diferenças aqui.

A primeira diferença é quando chamamos test1 ele chama uma variável sem pensar, apenas retorna os valores que estão armazenados nessa variável desconsiderando seu tipo de dado! Mas, quando chamamos test2, ele chama a function Array () e armazena nossos valores “Push” em sua propriedade “Value” , e o mesmo acontece quando alertamos test2 e retorna a propriedade “Value” do object array.

Então, quando verificamos se test1 é igual a test2, é claro que eles nunca retornarão true, um é uma function e o outro é uma variável (com um tipo de array), mesmo que tenham o mesmo valor!

Para ter certeza disso, tente o alerta 4, com o .value adicionado a ele; isso retornará verdadeiro. Neste caso, informamos ao JS “Desconsiderando o tipo do container, se foi function ou variável, por favor, compare os valores que estão armazenados em cada container e diga-nos o que você viu!” é exatamente o que acontece.

Espero ter dito claramente a ideia por trás disso, e desculpe pelo meu mau inglês.

A primeira é a chamada de construtor de object padrão. Usada principalmente para valores dynamics.

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

o segundo array é usado ao criar valores estáticos

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

A diferença de usar

 var arr = new Array(size); 

Ou

 arr = []; arr.length = size; 

Como foi discutido bastante nesta questão.

Eu gostaria de adicionar o problema de velocidade – o caminho mais rápido atual , no google chrome é o segundo.

Mas preste atenção, essas coisas tendem a mudar muito com as atualizações. Além disso, o tempo de execução será diferente entre diferentes navegadores.

Por exemplo – a segunda opção que eu mencionei, roda a 2 milhões [ops / second] no chrome , mas se você tentar no mozilla dev. você teria uma taxa surpreendentemente maior de 23 milhões.

De qualquer forma, sugiro que você verifique, de vez em quando, em diferentes navegadores (e máquinas), usando o site como tal

Não há grande diferença, eles basicamente fazem a mesma coisa, mas os fazem de maneiras diferentes, mas continue lendo, veja esta declaração no W3C:

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

e

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

Os dois exemplos acima fazem exatamente o mesmo. Não há necessidade de usar o novo Array ().
Para simplicidade, legibilidade e velocidade de execução, use o primeiro (o método literal de array).

Mas, ao mesmo tempo, criar um novo array usando a new Array syntax do new Array considerada uma prática ruim:

Evite novo Array ()

Não há necessidade de usar o construtor de array interno do JavaScript new Array ().
Use [] em vez disso.
Essas duas instruções diferentes criam um novo array vazio chamado points:

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

Essas duas instruções diferentes criam uma nova matriz contendo 6 números:

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

A nova palavra-chave apenas complica o código. Também pode produzir alguns resultados inesperados:

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

E se eu remover um dos elementos?

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

Então, basicamente, não é considerado como a melhor prática, também há uma pequena diferença lá, você pode passar o comprimento para new Array(length) como este, que também não é uma maneira recomendada.

Como eu sei a diferença vc pode encontrar o slice (ou os outros funcitons do Array) como code1 . E code2 show u Array e suas instâncias :

code1:

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

code2:

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

conclusão:

como vc pode ver [] e new Array() cria uma nova instancia de Array. E todos eles recebem as protótipos de Array.prototype

Eles são apenas diferentes instâncias de Array. Portanto, isso explica porque [] != []

🙂

Eu incorreu em um comportamento estranho usando [].

Temos Model “classs” com campos inicializados para algum valor. Por exemplo:

 require([ "dojo/_base/declare", "dijit/_WidgetBase", ], function(declare, parser, ready, _WidgetBase){ declare("MyWidget", [_WidgetBase], { field1: [], field2: "", function1: function(), function2: function() }); }); 

Descobri que quando os campos são inicializados com [] então, seriam compartilhados por todos os objects Model. Fazer alterações em um afeta todos os outros.

Isso não acontece inicializando-os com o new Array() . O mesmo para a boot de objects ( {} vs new Object() )

TBH Não tenho certeza se é um problema com o framework que estávamos usando ( Dojo )

Eu encontrei uma diferença entre as duas construções que me morderam muito.

Vamos dizer que eu tenho:

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

Na vida real, se eu fizer isso:

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

O que eu acabo é isso:

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

Eu não sei o que a especificação da linguagem diz que deve acontecer, mas se eu quiser que meus dois objects tenham matrizes de propriedades exclusivas em meus objects, eu tenho que usar o new Array() .

Usando o construtor Array faz uma nova matriz do comprimento desejado e preenche cada um dos índices com indefinido, o atribuído a uma matriz para uma variável cria os índices que lhe dão informações.