0:00:01.012,0:00:05.499
Agora que já sabe o básico de JavaScript,[br]quero ensinar um uso interessante dele.

0:00:05.629,0:00:09.546
Algo que chamamos de [br]"programação orientada a objetos"

0:00:09.546,0:00:12.570
Mas primeiro precisamos [br]entender porque isso é útil.

0:00:12.570,0:00:17.089
Pensei em um programa que faça sentido[br]o uso da Orientação a Objetos.

0:00:17.479,0:00:19.518
Agora, é bom um programa para se começar.

0:00:19.518,0:00:24.031
No topo tenho duas variáveis que [br]armazenam dados de um objeto.

0:00:25.021,0:00:28.414
Agora, o objeto literal é um [br]tipo de objeto que já vimos,

0:00:28.414,0:00:30.448
que criamos com duas chaves

0:00:30.448,0:00:33.419
e colocamos todos os nomes e valores[br]dessas propriedades dentro.

0:00:34.259,0:00:39.071
Então temos duas dessas variáveis objetos,[br]e embaixo temos essa função <i>drawWinston</i>

0:00:39.071,0:00:41.129
que recebe um único argumento,

0:00:41.129,0:00:47.842
e então desenha uma imagem baseada [br]nas propriedades x e y dos objetos.

0:00:47.842,0:00:52.447
e um título de acordo com as [br]propriedades apelido e idade do objeto.

0:00:52.747,0:00:57.624
E agora embaixo finalmente, chamamos[br]<i>drawWinston()</i> no adolescente e no adulto,

0:00:58.054,0:01:00.382
e isso é o que faz isso aparecer.

0:01:02.562,0:01:10.956
Agora, se vamos aqui, e olharmos para[br]esses objetos, veja que eles são parecidos

0:01:10.988,0:01:13.840
Ambos tem as mesmas propriedades,

0:01:13.850,0:01:17.337
e ambos podem ser usados para [br]chamar a função "drawWinston()."

0:01:17.787,0:01:19.564
Na verdade, se você para pra pensar,

0:01:19.624,0:01:24.072
ambos estão descrevendo [br]um tipo Winston, certo?

0:01:24.072,0:01:28.074
E podemos imaginar que talvez exista [br]esse tipo abstrato de Winston no mundo.

0:01:28.074,0:01:31.336
e todo Winston tem os [br]mesmos tipos de propriedades,

0:01:31.336,0:01:35.950
como apelido, idade, x e y.

0:01:36.260,0:01:41.898
E aqui o que fizemos foi criar [br]duas instâncias de Winston

0:01:41.898,0:01:44.506
para descrever um tipo único de Winston,

0:01:44.506,0:01:48.255
um é Winston adolescente e este um adulto.

0:01:48.255,0:01:54.381
Eles são realmente bem parecidos, e sabe,[br]há muitas coisas similares entre eles.

0:01:54.551,0:01:57.437
Se você pensar nisso, há muito do modo[br]como o mundo funciona também

0:01:57.437,0:02:00.867
por isso temos esses tipos de objetos [br]abstratos como humanos e pessoas.

0:02:00.867,0:02:03.057
e então somos apenas [br]instâncias específicas

0:02:03.057,0:02:05.564
de objetos com nossas pequenas[br]propriedades próprias.

0:02:05.754,0:02:09.931
Podemos usar técnicas [br]de orientação a objeto em JavaScript

0:02:09.931,0:02:14.088
para essas variáveis do Winston

0:02:14.868,0:02:17.805
são instâncias formais do objeto Winston,

0:02:17.805,0:02:21.194
eles sabem que eles [br]compartilham essas propriedades.

0:02:21.683,0:02:27.314
Pra isso, a primeira coisa que fazemos[br]é descrever este tipo abstrato de Winston.

0:02:27.844,0:02:30.497
E faremos isso com uma variável

0:02:30.737,0:02:32.420
Você armazenará o tipo em uma variável.

0:02:32.440,0:02:38.444
Então var Winston, usaremos W, pois sempre[br]iniciamos nosso objetos com maiúsculo

0:02:38.824,0:02:41.136
e vamos configurá-lo como uma função.

0:02:42.116,0:02:46.350
E essa função é um tipo especial que [br]chamamos de "construtor da função"

0:02:46.990,0:02:51.742
pois é isso o que será executado toda vez[br]que criarmos uma nova instância do Winston

0:02:51.962,0:02:57.400
Se quisermos criar um Winston adolescente[br]ou adulto, chamaremos essa função.

0:02:57.400,0:03:03.238
Significa que essa função deverá receber[br]qualquer argumento que precise saber,

0:03:03.238,0:03:06.387
afim de criar um Winston completo.

0:03:06.387,0:03:10.624
Nesse caso, precisa saber [br]o apelido, idade, x e y.

0:03:11.264,0:03:15.063
Agora, uma vez que recebemos esses [br]argumentos precisamos fazer algo com eles,

0:03:15.063,0:03:21.069
Precisamos na verdade associar [br]a informação ao objeto Winston.

0:03:21.069,0:03:24.655
Usaremos uma nova [br]palavra chave, chamada <i>this</i>.

0:03:25.325,0:03:28.632
E <i>this</i> se refere a [br]instância atual do objeto.

0:03:28.632,0:03:34.611
Então, <i>this.nickname</i>, a propriedade [br]nickname do objeto é igual a

0:03:34.861,0:03:38.199
o que for passado para [br]o construtor da função, ok?

0:03:38.419,0:03:44.688
E <i>this.age</i> é igual idade que é [br]passada, <i>this.x</i> é igual ao x e <i>this.y</i>

0:03:45.728,0:03:47.672
igual ao y da entrada.

0:03:48.282,0:03:52.826
Muito bem, agora temos este [br]tipo abstrato chamado Winston,

0:03:53.096,0:03:56.790
e tem o construtor da função que [br]usamos para criar o novo Winston.

0:03:57.340,0:03:59.185
Vamos tentar usá-lo.

0:04:00.165,0:04:02.010
Criaremos o Winston adolescente novamente

0:04:02.090,0:04:05.245
mas dessa vez [br]faremos <i>winstonTeen</i>, igual,

0:04:05.245,0:04:10.376
e ao invés de chaves, [br]usaremos igual <i>newWinston</i>.

0:04:10.376,0:04:13.790
Estamos dizendo "Queremos criar [br]uma nova instância do tipo Winston"

0:04:13.790,0:04:21.105
e então passaremos a informação [br]necessária, "Winsteen", 15, 20, 50.

0:04:22.175,0:04:25.652
E então podemos deletar esse antigo, [br]porque não precisamos mais.

0:04:27.362,0:04:30.202
E agora está criado o novo Winsteen.

0:04:31.052,0:04:34.942
E agora podemos fazer [br]<i>winstonAdult = new Winston()</i>

0:04:35.422,0:04:39.101
e é claro o nome dele é [br]"Mr. Winst-a-lot", bom nome,

0:04:39.721,0:04:43.320
e ele tem 30 anos, e a posição é 229 e 50.

0:04:43.750,0:04:46.580
Tudo bem? E então [br]podemos deletar esse objeto.

0:04:47.280,0:04:50.744
E, nosso código ainda funciona.

0:04:50.884,0:04:52.948
O que fizemos aqui foi o que[br]eu disse certo,

0:04:52.948,0:04:57.754
há esse, e esse tipo de dado [br]abstrato que são um Winston

0:04:57.754,0:05:04.262
e podemos criar novas instâncias que tem[br]essas propriedades deles que são únicas.

0:05:05.152,0:05:08.179
E apenas lembraremos [br]das propriedades dentro deles

0:05:08.799,0:05:14.299
Lembrar é muito importante. Você sabe que[br]aqui dentro temos this.nickname, this.age.

0:05:14.299,0:05:19.832
Se acidentalmente, não tiver essa idade, [br]perceba que agora diz, "undifined"

0:05:20.172,0:05:22.913
É porque lá embaixo,[br]essa função drawWinston,

0:05:22.913,0:05:27.972
aguarda todos os objetos serem [br]informados, inclusive "age" (idade).

0:05:28.162,0:05:30.324
E se não colocarmos <i>this.age</i>,

0:05:30.664,0:05:33.543
Não terá uma propriedade "age", certo? [br]Passamos para o construtor da função

0:05:33.543,0:05:35.132
Mas não fizemos nada com isso,

0:05:35.132,0:05:38.873
temos que incluir isto no objeto [br]usando a palavra chave <i>this</i>

0:05:39.133,0:05:40.432
Vamos adicionar novamente.

0:05:41.022,0:05:42.521
Agora,você deve estar pensando,

0:05:42.521,0:05:46.361
Ok, você tem o um código que funciona[br]e está fazendo essas mudanças.

0:05:46.361,0:05:50.542
Mas, sabe, o que [br]fizemos já foi feito antes.

0:05:50.542,0:05:51.873
Mas aqui está a parte legal.

0:05:51.873,0:05:55.746
Agora, todo o nosso Winston [br]usa o mesmo construtor.

0:05:55.816,0:06:00.467
Se quisermos, podemos [br]mudar propriedades do Winston.

0:06:00.717,0:06:02.478
Todos os Winstons, aqui dentro.

0:06:02.478,0:06:05.830
Talvez "age" (idade), talvez [br]queiramos mudar para "years old" (anos).

0:06:05.920,0:06:07.282
Podemos mudar apenas aqui,

0:06:07.372,0:06:12.545
e agora em todos os nossos Winstons ficará[br]"15 years old", "30 years old", certo?

0:06:12.545,0:06:14.618
Eles estão pegando a parte que[br]é única deles

0:06:14.618,0:06:16.961
mas também está usando coisas que são[br]compartilhadas entre eles.

0:06:16.961,0:06:19.481
Isso é a parte legal da programação[br]orientada a objeto

0:06:19.481,0:06:22.721
essa ideia que há esses [br]tipos de objetos no mundo,

0:06:22.721,0:06:26.022
e você pode criar novas [br]instâncias desses objetos.

0:06:26.022,0:06:29.190
Há coisas que são parecidas neles, como a[br]mesma propriedade,

0:06:29.190,0:06:31.078
e há coisas que são diferentes como,

0:06:31.078,0:06:35.028
essa propriedade na verdade tem um valor[br]diferente dessa outra propriedade, certo?

0:06:35.118,0:06:39.688
Então, podemos ter o mesmo comportamento,[br]como chamar as mesmas funções.

0:06:40.538,0:06:42.758
e então usá-las de modo parecido.

0:06:43.108,0:06:46.069
Essa é uma das coisas legais em[br]programação orientada a objeto.

0:06:46.069,0:06:48.344
mas como você verá, há mais coisas.

0:06:48.344,0:06:49.810
Então, fique ligado!

0:06:49.810,0:06:51.000
Legendado por [Valter Bigeli][br]Revisado por [Fernando dos Reis]