logo javascript

Aprenda javascript com facilidade do zero

Prof. Ivan Lourenço Gomes

Tipos de dados - Arrays

Arrays são sequências ordenadas de valores. Estes valores podem ser de qualquer tipo de dados e devem estar separados por vírgula. O símbolo que identifica os arrays são os colchetes [ ].

                    
    var alunos = [ "João" , "Maria", "José" ];
    var num_primos = [ 2, 3, 5, 7, 11, 13 ];
                    
                

Lembre-se que quando falamos sobre strings, falamos sobre eles serem uma sequência de caracteres, que tem um tamanho e onde cada caractere pode ser acessado por meio de um índice. Os arrays tem essas mesmas características.

                    
    var alunos = [ "João" , "Maria", "José" ];
    console.log(alunos.length); // o console mostrará 3
    console.log(alunos[0]);  // o console mostrará "João"

                    
                

Os elementos de um array podem ser de qualquer tipo de dados, inclusive arrays e objetos. Neste caso, este são chamados de arrays multidimensionais e são os que provocam confusão na cabeça de muitos iniciantes em Javascript. Porém, com um pouco de atenção, é muito fácil interpretar um array multidimensional. Vamos ver um exemplo bem simples:

                    

    var grupos = [ 
        [ "João" , "Maria" ],
        [ "Pedro" , "Joana", "André", "Júlio" ],
        [ "Carolina" , "Helena", "Marcelo" ]
    ];

                    
                

A variável grupos é um array usado para guardar grupos de alunos. Agora responda, quantos elementos tem o array grupos?

O array grupos possui 3 elementos e cada um destes elementos é um array.

                    
    console.log(grupos.length); // o console mostrará 3
    console.log(grupos[1]);  // o console mostrará [ "Pedro" , "Joana", "André", "Júlio" ]

    /* podemos acessar também os elementos internos de cada grupo, basta usar a notação do índice duas vezes */

    console.log(grupos[1][2]);  // o console mostrará "André"

                    
                

Operações com arrays

  • Push - Adiciona elementos ao final de um array
  • Pop - Remove o último elemento de um array
  • Shift - Remove o primeiro elemento de um array
  • Unshift - Adiciona elementos ao início de um array
  •                     
    
        var cursos = [ "HTML", "Python", "PHP" ];
    
        cursos.push("Javascript");
    
        console.log(cursos);  // O console mostrará [ "HTML", "Python", "PHP", "Javascript" ]
    
        cursos.unshift("Bootstrap");
    
        console.log(cursos);  // O console mostrará [ "Bootstrap", "HTML", "Python", "PHP", "Javascript" ]
    
        cursos.pop();
    
        console.log(cursos);  // O console mostrará [ "Bootstrap", "HTML", "Python", "PHP" ]
    
        cursos.shift();
    
        console.log(cursos);  // O console mostrará [ "HTML", "Python", "PHP" ]
    
                        
                    

    É possível também definir elementos em lugares específicos usando a notação do índice

                        
    
        var ingredientes = [ "pão branco", "queijo", "presunto" ];
    
        ingredientes[0] = "pão integral";
    
        console.log(ingredientes);  // O console mostrará [ "pão integral", "queijo", "presunto" ]
    
                        
                    
  • Slice - extrai parte de um array
  • O método slice serve para extrair parte de um array. Fazemos isso informando o índice de início e fim que queremos selecionar.

                        
    
        var alunos = [ "João" , "Maria", "José", "Fernanda", "Pedro", "Elisa" ];
        console.log( alunos.slice(0,3) );
    
        // O console mostrará [ "João" , "Maria", "José" ]
    
                        
                    

    É possível também usar número negativos para contar desde o final do array (o último elemento de um array é o -1).

                        
    
        var alunos = [ "João" , "Maria", "José", "Fernanda", "Pedro", "Elisa" ];
        
        console.log( alunos.slice(,-2) );
        // O console mostrará [ "João" , "Maria", "José", "Fernanda" ]
        /* O slice começa no primeiro elemento, e vai até o penúltimo elemento, neste caso o índice 4, 
        com este elemento excluído. */
    
        console.log( alunos.slice(-3,) );
        // O console mostrará [ "Fernanda", "Pedro", "Elisa" ]
        // O slice inclui os três últimos elementos.
    
                        
                    

    Índice de Aulas