Você está na página 1de 17

Javascript

Aula 03
PROF. GUSTAVO LINHARES
OBJETIVOS

 Aprender como utilizar arrays em Javascript.


O que é um Array?

 Além das variáveis escalares que armazenam apenas um valor por


vez, podemos criar arrays.
 Um array é uma variável especial, que pode conter mais de um
valor por vez.
 Se você tem uma lista de itens (uma lista de nomes de carros, por
exemplo), armazenar os carros em variáveis individuais pode ser
assim:

var car1 = "Saab";


var car2 = "Volvo";
var car3 = "BMW";
O que é um Array?

 No entanto, e se você quiser percorrer os carros e encontrar um


específico? E se você não tivesse 3 carros, mas 300?

 A solução é uma Array!

 Uma Array pode armazenar muitos valores com um único nome, e


você pode acessar os valores consultando um número de índice.
Mas o que é um índice?

 O índice de um array é o endereço no qual localizamos o valor da


variável.
 Em programação de computadores, um array é uma estrutura de
dados que armazena uma coleção de elementos de tal forma que
cada um dos elementos possa ser identificado por, pelo menos, um
índice ou uma chave.
Criando um Array

Sintaxe:

var name = [item1, item2, ...];


Exemplo:
var cars = ["Saab", "Volvo", "BMW"];
obs.: Espaços e quebras de linha não são importantes. Uma declaração
pode abranger várias linhas:
var cars = [
"Saab",
"Volvo",
"BMW"
];
Usando a palavra-chave new

 O exemplo a seguir também cria um Array e atribui valores a ela:


var cars = new Array("Saab", "Volvo", "BMW");
Arrays/vetores de JavaScript

 Por exemplo, as duas linhas a seguir definem dois vetores e outro


com cinco elementos predefinidos;
 var vetor = new Array;
 var outrovetor = new Array(1,2,3,4,5);
Arrays/vetores de JavaScript

 Arrays de JavaScript são usados para armazenar vários valores em


uma única variável.

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


Arrays/vetores de JavaScript

 Outra alternativa seria simplesmente manipularmos uma variável


como se fosse um array, sem informar seu tipo.

var vetor;
vetor[2]=“Livro”;
vetor[4]=“Ajax”;
Arrays/vetores de JavaScript

 Para obter o número de elementos de um vetor, utilizamos seu


atributo length.

 var vetor = new Array(1,2,3);


 document.write(“O vetor possui” + vetor.length +”elementos!”);

 Este script exibirá como resultado a frase:


 O vetor possui 3 elementos;
Arrays/vetores de JavaScript

 Métodos sort() e join()


 O método sort classifica os elementos do vetor em ordem
alfabética, enquanto join retorna todos os elementos do vetor.

<script>
var vetor = new Array(“Januária”,”Salinas”,”Pirapora”);
document.write(“Elementos do vetor:”+vetor.join()+”<br />”);
ducument.write(“Vetor ordenado:”+vetor.sort());
</script>
Acesse os elementos de um array

 Você se refere a um elemento de array referente ao número de


índice .

 Esta declaração acessa o valor do primeiro elemento em carros:

var name = cars[0];


Esta declaração modifica o primeiro elemento em carros:

cars[0] = "Opel";
Acesse os elementos de um array

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


 document.getElementById("demo").innerHTML = cars[0];
 [0] é o primeiro elemento em uma matriz. [1] é o segundo. Os
índices de matriz começam com 0.
Acesse todos os dados de um
Array
 Com o JavaScript, pode acessar o array completo consultando o
nome da array:

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


document.getElementById("demo").innerHTML = cars;

Exemplo:
https://www.w3schools.com/js/tryit.asp?filename=tryjs_array_full
Convertendo Arrays para Strings

 O método JavaScript toString () converte uma array em uma


seqüência de valores de matriz (separados por vírgulas).

Exemplo:

var fruits = ["Banana", "Orange", "Apple", "Mango"];


document.getElementById("demo").innerHTML = fruits.toString();

Resultado
Banana,Orange,Apple,Mango
Exercícios

1. Crie uma array chamada cars , atribua os valores "Saab", "Volvo" e


"BMW", e exiba-o.
2. Exibir o item "Volvo" da array de carros.
3. Altere o primeiro item de cars para "Opel", consultando o número
do índice e exibindo todo a array.
4. Use a propriedade length para exibir o número de itens do array
de cars.

Você também pode gostar