WEBVTT

00:00:00.938 --> 00:00:04.358
Até agora, nós vimos como 
criar um vetor e acessá-lo

00:00:04.378 --> 00:00:06.430
Assim como em outras 
variáveis, no entanto,

00:00:06.430 --> 00:00:08.568
uma das coisas bem legais sobre vetores

00:00:08.568 --> 00:00:12.336
é a maneira que podemos modificá-los
dinamicamente enquanto um programa roda.

00:00:13.015 --> 00:00:15.421
Ok, deixe-me mostrar o que 
eu quis dizer com isso.

00:00:15.421 --> 00:00:17.888
Então aqui nós temos este programa que 


00:00:17.888 --> 00:00:20.697
mostra Hopper segurando 
alguns balões, super fofo.

00:00:21.393 --> 00:00:25.219
E então isso funciona da seguinte forma: 
nós temos esse vetor xPositions

00:00:25.219 --> 00:00:29.598
que possui dois números dentro que 
dizem onde queremos colocar os balões.

00:00:29.598 --> 00:00:32.272
E aqui embaixo nós temos 
esse laço de repetição,

00:00:32.272 --> 00:00:35.218
e esse laço passa por todos 
os elementos desse vetor.

00:00:35.637 --> 00:00:40.066
Para cada um deles, é desenhado uma linha 
do "x" para baixo até o braço do Hooper,

00:00:40.066 --> 00:00:47.263
e então desenha uma elipse em "x" 
que é 30x40 pixels, e esse é nosso balão.

00:00:47.263 --> 00:00:51.370
Ok, legal. Então agora que 
sabemos como isso funciona,

00:00:51.370 --> 00:00:54.079
sabemos que se quisermos 
outro balão aparecendo,

00:00:54.079 --> 00:00:58.596
podemos adicionar um número a este 
vetor, certo? Como, por exemplo, 300.

00:00:58.596 --> 00:01:02.291
Lindo. Agora nós possuímos 
três balões para um Hopper feliz.

00:01:02.491 --> 00:01:08.394
Mas digamos que nós queremos dar
a um usuário que não sabe programar

00:01:08.394 --> 00:01:10.878
a habilidade de adicionar novos balões.

00:01:10.878 --> 00:01:13.705
Então queremos dar o 
programa a um usuário e falar:

00:01:13.705 --> 00:01:17.890
"Ei, você pode clicar em qualquer 
lugar, e o balão irá aparecer."

00:01:17.938 --> 00:01:20.891
Isso não seria legal? Eu acho que seria.

00:01:20.966 --> 00:01:23.663
Então, como faríamos isso?

00:01:23.713 --> 00:01:26.382
Queremos nosso programa mudando
ao longo do tempo, certo?

00:01:26.382 --> 00:01:30.515
Toda vez que o usuário clicar, 
irá aparecer um balão lá.

00:01:30.515 --> 00:01:35.045
Então vamos começar movendo 
tudo para uma função desenhar

00:01:35.045 --> 00:01:37.902
assim será fácil de mudar
ao longo do tempo.

00:01:37.902 --> 00:01:43.197
Nós iremos mover isso para baixo 
e colocar a indentação aqui. Ok, ótimo.

00:01:43.467 --> 00:01:48.477
Agora nós queremos checar e ver,
o usuário está pressionando o mouse agora?

00:01:48.477 --> 00:01:50.663
Bem, podemos fazer isso com o nosso "if".

00:01:50.663 --> 00:01:55.493
Então if(mousePressionado), e 
então nós faremos alguma coisa.

00:01:55.493 --> 00:01:58.426
O que nós iremos fazer? 
Se o mouse é pressionado,

00:01:58.426 --> 00:02:01.610
então nós queremos de alguma forma
adicionar um número a este vetor.

00:02:01.610 --> 00:02:04.694
E vamos deixar isso com apenas
dois elementos de novo. Ok.

00:02:04.694 --> 00:02:07.926
Nós queremos adicionar um 
número a este vetor de alguma forma.

00:02:07.926 --> 00:02:11.102
Bem, eu irei mostrar uma 
maneira que podemos fazer isso.

00:02:11.102 --> 00:02:18.389
Então nós podemos dizer 
xPositons[2] = mouseX;

00:02:18.389 --> 00:02:22.204
Muito bem, e deixe-me 
mostrar que isso funciona.

00:02:22.204 --> 00:02:26.548
Eu cliquei, e eu tenho um balão.
Então, o que isso faz?

00:02:26.548 --> 00:02:33.927
Isso disse, xPositons[2] disse ache esse
vetor e encontre o elemento na posição 2,

00:02:33.927 --> 00:02:36.456
e lembre-se que este na
verdade é o terceiro elemento,

00:02:36.456 --> 00:02:38.499
porque nossos vetores começam do zero.

00:02:38.499 --> 00:02:42.256
E, se você olhar, não existe terceiro
elemento, certo? Não existe nada no lugar.

00:02:42.256 --> 00:02:45.972
Então isso diz para achar isto, e 
então coloque o mouseX nessa posição.

00:02:45.972 --> 00:02:51.196
Bem, já que não existe nada lá, então 
muda de nada para mouseX.

00:02:51.196 --> 00:02:54.457
E agora nosso vetor possui
três itens de tamanho,

00:02:54.457 --> 00:02:57.030
e esse laço "for" aqui embaixo
quando passa pelo vetor,

00:02:57.030 --> 00:03:00.427
irá desenhar o terceiro balão.

00:03:00.427 --> 00:03:04.190
Isso é bem legal, e deixe-me clicar mais
um pouco para te mostrar como funciona.

00:03:04.190 --> 00:03:08.932
Você vê que toda vez que eu clico, ele 
continua desenhando o terceiro balão

00:03:08.932 --> 00:03:11.318
onde quer que eu clique com meu mouse.

00:03:11.318 --> 00:03:15.918
E isso é porque estamos constantemente
sobrescrevendo a posição dois.

00:03:15.918 --> 00:03:18.547
A coisa com o índice dois.

00:03:18.547 --> 00:03:23.162
Estamos constantemente 
sobrescrevendo com o atual mouseX.

00:03:23.162 --> 00:03:28.298
Então nós sempre teremos três balões 
porque temos esse aqui na posição zero,

00:03:28.298 --> 00:03:34.598
esse na posição um e nós iremos 
constantemente mudar a posição dois. Ok?

00:03:34.598 --> 00:03:37.173
Então isso é legal, mas o 
que nós realmente queremos

00:03:37.173 --> 00:03:40.305
é deixar o usuário criar 
vários balões, certo?

00:03:40.305 --> 00:03:43.435
Para que toda vez que o usuário 
clicar, apareça um novo balão.

00:03:43.435 --> 00:03:46.245
Então isso significa que devemos 
constantemente incrementar

00:03:46.245 --> 00:03:50.611
o índice do elemento do vetor
em que estamos guardando.

00:03:50.611 --> 00:03:52.562
Não queremos que seja
dois todas as vezes,

00:03:52.562 --> 00:03:56.200
nós queremos que seja d\ois, e três,
e depois quatro, e cinco, e seis, etc.

00:03:56.200 --> 00:03:59.056
Poderíamos fazer isso tendo uma
pequena variável de contagem.

00:03:59.056 --> 00:04:01.004
Então digamos newInd=2;

00:04:01.004 --> 00:04:05.285
Isso é como ela vai ser inicializada, 
então iremos dizer newlnd em vez de dois.

00:04:05.285 --> 00:04:09.655
E então o que nós realmente 
queremos fazer é dizer newlnd++

00:04:09.655 --> 00:04:11.808
Então cada vez adicionamos um a ela.

00:04:11.808 --> 00:04:15.181
Iremos começar com dois, 
então se torna três e depois quatro.

00:04:15.181 --> 00:04:18.476
Assim, toda vez que é pressionado, 
aparecem mais. Então vamos testar.

00:04:18.476 --> 00:04:22.278
Ta-da! Vários balões. 
Festa de balões. Woo!

00:04:22.278 --> 00:04:27.502
Então isso é legal, não é? Mas essa 
não é a melhor maneira de fazer isso

00:04:27.502 --> 00:04:32.045
pois acontece que adicionar itens a um 
vetor é algo que queremos fazer muito.

00:04:32.045 --> 00:04:34.666
Então temos uma maneira
mais fácil de fazer do que essa.

00:04:34.666 --> 00:04:38.372
Deixe-me deletar algumas
coisas que eu fiz.

00:04:38.372 --> 00:04:42.657
Tudo bem, então nós não precisamos 
disso. Vamos deixar isso comentado.

00:04:42.657 --> 00:04:50.881
Então fazemos isso chamando
xPositions.push e então mouseX.

00:04:50.881 --> 00:04:56.261
Então o que estamos fazendo aqui, estamos 
chamando esse método no vetor xPositions.

00:04:56.261 --> 00:04:58.355
Estamos chamando como
um comando em um vetor.

00:04:58.355 --> 00:04:59.598
Estamos dizendo ao vetor,

00:04:59.598 --> 00:05:05.280
"Olha, coloque esse novo valor, que 
é mouseX, coloque isso no final do vetor."

00:05:05.280 --> 00:05:09.210
Então toda vez que for chamado, 
toda vez que pressionar o mouse,

00:05:09.210 --> 00:05:12.486
irá olhar para o mouseX 
e colocá-lo no final do vetor.

00:05:12.486 --> 00:05:17.058
Assim, o vetor ficará maior e maior. 
Então vamos recomeçar e tentar isto.

00:05:17.058 --> 00:05:22.344
Ta-da, funcionou! E é bem menos código 
do que nós tínhamos antes. Tudo bem?

00:05:22.508 --> 00:05:25.370
Assim, a maior parte do tempo, 
você vai querer usar o envio,

00:05:25.370 --> 00:05:27.794
se for adicionar coisas 
para seu vetor desse jeito.

00:05:27.794 --> 00:05:31.541
E é elegante porque assim você pode ter
vetores que crescem durante o programa.

00:05:31.541 --> 00:05:34.397
Como quando você tem uma animação
ou usuários fazendo coisas,

00:05:34.397 --> 00:05:36.067
e então você pode fazer muito mais.

00:05:36.397 --> 00:05:41.510
Então você viu 90% do que provavelmente
vai fazer com um vetor e jeitos de usá-los

00:05:41.510 --> 00:05:43.798
Mas ainda existe muitas
utilidades para um vetor.

00:05:43.798 --> 00:05:47.079
Então se você tiver dúvidas,
pergunte na conversa.

00:05:47.079 --> 00:05:49.765
Mas tenha certeza de 
dominar o básico primeiro.

00:05:49.765 --> 00:05:51.000
Legendado por [Gabriel Mello Fernandes]
Revisado por [Alberto Oliveira]