{"id":842,"date":"2024-05-05T17:00:11","date_gmt":"2024-05-05T20:00:11","guid":{"rendered":"https:\/\/thiagorossi.com.br\/blog\/?p=842"},"modified":"2025-11-13T11:56:50","modified_gmt":"2025-11-13T14:56:50","slug":"arrays-no-javascript","status":"publish","type":"post","link":"https:\/\/thiagorossi.com.br\/blog\/arrays-no-javascript\/","title":{"rendered":"Arrays no Javascript"},"content":{"rendered":"Tempo de leitura: <\/span> 3<\/span> minutos<\/span><\/span>\n

Arrays no Javascript<\/strong>: Os Arrays<\/strong> s\u00e3o a estrutura de dados mais b\u00e1sica e crucial em JavaScript, permitindo armazenar cole\u00e7\u00f5es ordenadas de valores. Eles s\u00e3o como listas sequenciais<\/strong> onde cada elemento ocupa uma posi\u00e7\u00e3o definida por um \u00edndice num\u00e9rico<\/strong> que come\u00e7a em zero (0<\/code>)<\/strong>.<\/p>\n\n\n\n

Embora Arrays sejam cole\u00e7\u00f5es, \u00e9 importante lembrar que em JavaScript, um Array \u00e9 um tipo especial de Objeto<\/strong>.<\/p>\n\n\n\n

<\/div>\n\n\n\n

1. Criando e Acessando Arrays<\/h2>\n\n\n\n

A maneira mais comum e recomendada de criar um array<\/em> \u00e9 usando a sintaxe de literal de array<\/em><\/strong>.<\/p>\n\n\n\n

<\/div>\n\n\n\n

A. Cria\u00e7\u00e3o e Propriedade length<\/code><\/h3>\n\n\n\n

JavaScript<\/p>\n\n\n\n

\/\/ Cria\u00e7\u00e3o por Literal (Recomendado)\nlet cores = [\"vermelho\", \"verde\", \"azul\"];\n\n\/\/ Propriedade: Retorna o n\u00famero de elementos (n\u00e3o o \u00edndice)\nconsole.log(cores.length); \/\/ Sa\u00edda: 3\n<\/code><\/pre>\n\n\n\n
<\/div>\n\n\n\n
B. Acesso e Modifica\u00e7\u00e3o<\/h3>\n\n\n\n
O acesso e a modifica\u00e7\u00e3o s\u00e3o feitos usando a nota\u00e7\u00e3o de colchetes []<\/code><\/strong> e o \u00edndice (posi\u00e7\u00e3o) do elemento.<\/p>\n\n\n\n
JavaScript<\/p>\n\n\n\n
\/\/ Acessando: \u00cdndices come\u00e7am em 0\nconsole.log(cores[0]); \/\/ Sa\u00edda: \"vermelho\"\n\n\/\/ Modificando\ncores[1] = \"amarelo\";\nconsole.log(cores); \/\/ Sa\u00edda: [\"vermelho\", \"amarelo\", \"azul\"]\n<\/code><\/pre>\n\n\n\n
<\/div>\n\n\n\n
2. M\u00e9todos de Manipula\u00e7\u00e3o B\u00e1sica (Mut\u00e1veis)<\/h2>\n\n\n\n
Esses m\u00e9todos alteram (mutam<\/em>) o array<\/em> original, modificando seu tamanho ou conte\u00fado.<\/p>\n\n\n\n
M\u00e9todo<\/strong><\/td>A\u00e7\u00e3o<\/strong><\/td>Retorno<\/strong><\/td>Exemplo<\/strong><\/td><\/tr><\/thead>
push()<\/code><\/strong><\/td>Adiciona ao final<\/strong>.<\/td>Novo length<\/code>.<\/td>cores.push(\"roxo\");<\/code><\/td><\/tr>
pop()<\/code><\/strong><\/td>Remove do final<\/strong>.<\/td>O elemento removido.<\/td>let ultimo = cores.pop();<\/code><\/td><\/tr>
unshift()<\/code><\/strong><\/td>Adiciona ao in\u00edcio<\/strong>.<\/td>Novo length<\/code>.<\/td>cores.unshift(\"branco\");<\/code><\/td><\/tr>
shift()<\/code><\/strong><\/td>Remove do in\u00edcio<\/strong>.<\/td>O elemento removido.<\/td>let primeiro = cores.shift();<\/code><\/td><\/tr>
splice()<\/code><\/strong><\/td>Adiciona\/Remove em qualquer ponto<\/strong>.<\/td>Array de elementos removidos.<\/td>cores.splice(1, 1, \"ciano\");<\/code> (Remove 1 a partir do \u00edndice 1, e insere “ciano”)<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
<\/div>\n\n\n\n
3. M\u00e9todos de Itera\u00e7\u00e3o e Transforma\u00e7\u00e3o (Imut\u00e1veis)<\/h2>\n\n\n\n
Esses m\u00e9todos s\u00e3o cruciais no JavaScript moderno. Eles n\u00e3o alteram o array<\/em> original, mas sim retornam um novo array<\/em><\/strong> ou um novo resultado.<\/p>\n\n\n\n