Javascript Arrays Tutoriais - explicado com exemplos para iniciantes

Javascript Arrays Tutoriais - explicado com exemplos para iniciantes

Enquanto aprendemos qualquer linguagem de programação, encontramos o aprendizado de matrizes. Matrizes são úteis quando é necessário armazenar vários valores diferentes em uma única variável. Aplicação de matrizes é vista em muitos lugares, como implementar as matrizes, estruturas de dados ou armazenar dados em forma de tabular.

O conceito de matrizes veio do arranjo de objetos na vida real. A maneira como organizamos objetos na vida real, podemos organizar os dados na programação. Portanto, este post tem tudo a ver com aprender o núcleo e os conceitos básicos de matrizes em JavaScript. Vamos mergulhar e ter uma compreensão clara de uma matriz, como criá -la e usá -la para atribuir, acessar e alterar valores.

O que é uma matriz?

Uma matriz é um tipo de variável em qualquer linguagem de programação usada para armazenar vários valores simultaneamente. As matrizes armazenam os dados na forma de segmentos, também conhecidos como elementos da matriz; portanto, em palavras simples, uma matriz é uma coleção de elementos.

Geralmente os usamos para armazenar o mesmo tipo de valores ou a lista de itens em um local/variável como o nome dos animais ["Leão", "urso", "macaco"] ou lista de estudantes ["John", "Bob", "Ivan"].

No entanto, podemos armazenar vários tipos de dados em matrizes, como cordas, números inteiros, matrizes ou até funções.

Os tipos de matriz relativos à implementação são divididos em quatro tipos:

  • Matrizes homogêneas
  • Matrizes heterogêneas
  • Matrizes multidimensionais
  • Matrizes irregulares

Vamos ter uma breve introdução de cada tipo.

Array homogêneo:

A matriz em que os elementos são do mesmo tipo de dados é conhecida como uma matriz homogênea. Por exemplo, string, números inteiros ou valores de bool.

var stringarr = ["John", "Bob", "Ivan"];
var intarr = [23, 45, 67];

Matriz heterogênea

A matriz em que os valores de vários tipos de dados são armazenados é conhecida como matriz heterogênea. Por exemplo:

var aluno = ["John", 25, "masculino"]

Array multidimensional:

A matriz que contém mais matrizes como elementos é conhecida como uma matriz multidimensional. Por exemplo, lista de alunos:

var aluno = [["John", 25, "masculino"], ["Steve", 21, "masculino"], ["Angela", 22, "feminino"]]]

Array irregular:

Jagged é quase o mesmo que uma matriz multidimensional, mas com uma diferença sutil no número de elementos nos sub-maiores de uma matriz. A matriz multidimensional na qual os conjuntos de dados adicionais de matrizes não são uniformes.

var aluno = [["John"], ["Steve", 21, "masculino", ["Angela", "feminino"]]]

Observação: Usaremos o console do navegador para demonstrar exemplos realizados neste post. Para abrir o console do navegador:

  • use o F12 Chave no Chrome e outros navegadores à base de cromo.
  • usar Ctrl + Shift + K teclado teclas de atalho para mozilla.
  • usar Opção + ⌘ + C teclado Chaves de atalho no Safari (se o menu do desenvolvedor não aparecer, abra preferências pressionando ⌘ +, e na guia avançada verificação “Mostrar desenvolver menu na barra de menus”).

Como criar uma matriz?

Como o JavaScript é uma linguagem de script, não precisamos declarar o tipo e atribuir alguns valores a uma variável. Podemos escrever diretamente o nome da variável sem mencionar o tipo de dados variável e atribuir valores a ele.

Por exemplo:

var linguagens = ["javascript", "python", "java"];

Como atribuir valores a uma matriz?

Embora possamos atribuir valores a uma matriz ao criar a matriz, há outra maneira de atribuir valores é atribuir valores a índices específicos. O local onde um item está presente em uma matriz é conhecido como seu índice.

Por exemplo:

var linguagens = [];
idiomas [0] = "javascript";
idiomas [1] = "python";

Observação: Nas matrizes, os números de índice começam de "0" (zero):

Como alterar o valor de um elemento de matriz?

O valor de um elemento presente em uma matriz pode ser alterado da mesma maneira que podemos atribuir seus valores.

Por exemplo, se queremos alterar o valor do primeiro índice da matriz "idiomas", a declaração será assim:

idiomas [0] = "TypeScript";

Propriedades e métodos de matriz embutidos:

A verdadeira vantagem de JavaScript são suas propriedades e métodos internos para matrizes. As propriedades e métodos mais comuns de matriz presentes no JavaScript são:

variedade.Propriedade de comprimento:

O "variedade.comprimento”A propriedade pode ser usada para obter o número de itens/elementos presentes em uma matriz. Por exemplo:

var linguagens = ["javascript", "python", "java"];
console.log (idiomas.comprimento);

variedade.Método Sort ():

Esse Variedade.Método Sort () classifica os elementos presentes em uma matriz em ordem ascendente.

Suponha que tenhamos uma variedade de três linguagens de programação:

var linguagens = ["javascript", "python", "java"];

E queremos resolvê -los em ordem alfabética para que a função de classificação seja assim:

Vamos STOREDLANG = LUMANES.organizar();
console.log (classedlang);

Na saída, você pode ver que a matriz é classificada como desejávamos:

Como acessar os elementos/itens de uma matriz?

Os elementos da matriz podem ser acessados ​​mencionando o número do índice.

Por exemplo, queremos acessar o segundo elemento de uma matriz; A declaração seria assim:

Deixe SecondLanguage = idiomas [1];

Observação: O número do índice da matriz começa de zero “0”:

Como acessar o primeiro elemento/item de uma matriz?

Desde que os índices de matriz começam de “0,”Para que possamos acessar o primeiro elemento de uma matriz mencionando“0”Nos suportes quadrados, como mostrado abaixo:

Deixe primeiro Language = idiomas [0];

Como acessar o último elemento/item de uma matriz?

Para obter o último item de uma matriz, o “variedade.comprimento”Propriedade vem em ajuda. Podemos acessar o último elemento presente em uma matriz mencionando “variedade.comprimento -1”Nos suportes quadrados, como mostrado abaixo:

Let Language = Languages ​​[idiomas.comprimento - 1];

Como fazer um loop através de uma matriz?

Para colocar todos os elementos presentes em uma matriz, a melhor maneira é percorrer uma matriz. As maneiras mais convenientes e eficientes são usar:

  • Para loop
  • Método de Foreach do Array

Para loop:

Para buscar todos os elementos usando um loop para o loop é o caminho mais fácil. Basta executar o código fornecido abaixo para percorrer toda a matriz e buscar todos os elementos um por um:

var linguagens = ["javascript", "python", "java"];
para (vamos i = 0; i < languages.length; i++)
const idioma = idiomas [i];
console.log (idioma);

No código acima, você pode ver que usamos línguas.comprimento Propriedade na cláusula condicional de for loop, a fim de percorrer toda a matriz sem saber o número total de elementos na matriz.

Método de Foreach de Array:

JavaScript também fornece o método para each da matriz para percorrer toda a matriz. A sintaxe de usar o método para each é o seguinte:

var linguagens = ["javascript", "python", "java"];
línguas.foreach (Onelang);
função onelang (idioma)
console.log (idioma);

A sintaxe acima fornecida pode ser reduzida usando a função de retorno de chamada em linha, conforme dado abaixo:

línguas.foreach ((idioma) =>
console.log (idioma);
)

Matrizes associativas em JavaScript?

Matrizes associativas são as matrizes que nomearam índices. JavaScript não suporta tais matrizes. Se você o fizer, o JavaScript o levará como um objeto, e os métodos e propriedades da matriz não se aplicarão a ele.

JavaScript Matrizes são objetos:

Sim, o tipo de Array em JavaScript é objeto. É por isso que as matrizes podem conter diferentes tipos de variáveis. Matrizes podem conter objetos, funções e até matrizes dentro de uma matriz como um elemento.

Se usarmos o TIPOOF Operador sobre uma variável de matriz:

var linguagens = ["javascript", "python", "java"];
console.log (typeof (linguagens));

Isso mostrará que o tipo de “línguas”A variável de matriz é um objeto.

No entanto, ainda existem algumas diferenças conceituais entre matrizes e objetos:

Diferença entre matrizes e objetos:

  • Nas matrizes, os índices são indicados por números.
  • Enquanto, em objetos, os índices podem ser denotados por nomes (números ou alfabetos).

Portanto, é melhor escolher o tipo de variável certo no lugar certo:

  • Use matrizes quando tiver uma grande lista de itens.
  • Use objetos quando precisar atribuir nomes aos índices.

Agora, surge a questão, como identificar se uma variável é um objeto ou matriz.

Como identificar uma variável de matriz?

Para identificar, uma variável é uma matriz ou não, o JavaScript fornece um Variedade.função isarray ().

Por exemplo:

var linguagens = ["javascript", "python", "java"];
console.log (matriz.isarray (idiomas));

O código acima retornará verdadeiro.

Observação: O Variedade.função isarray () foi introduzido em Ecmascript 5.

Conclusão

Esta postagem contém todo o conhecimento básico e necessário necessário para começar com matrizes em javascript. Primeiro, apresentamos o que são as matrizes, depois aprendemos a criar, atribuir e alterar os valores de uma matriz.

Além disso, aprendemos algumas propriedades e funções embutidas básicas de matrizes em JavaScript para se tornar mais interativo com as matrizes. No final, discutimos o tipo de matriz de dados e a diferença entre matrizes e objetos em detalhes.