Return to Video

Tipos de Objeto (Versão vídeo)

  • 0:01 - 0:05
    Agora que já sabe o básico de java script, eu quero ensinar um uso interessante do Javascript.
  • 0:06 - 0:10
    Algo que chamamos de
    "programação orientada a objetos"
  • 0:10 - 0:13
    Mas primeiro precisamos
    entender porque isso é útil.
  • 0:13 - 0:17
    Então pensei em um programa que
    em faça sentido o uso da orientação objeto.
  • 0:17 - 0:20
    Agora, é bom a programa para se começar.
  • 0:20 - 0:24
    No topo tenho duas variáveis que
    armazenam dados de um objeto.
  • 0:25 - 0:28
    Agora, o objeto literal é um
    tipo de objeto que já vimos,
  • 0:28 - 0:30
    que criamos com duas chaves
  • 0:30 - 0:33
    e colocamos todas os nomes
    dessas propriedades e valores dentro.
  • 0:34 - 0:39
    Então temos duas dessas variáveis objetos,
    e embaixo temos essa função "drawWinston"
  • 0:39 - 0:41
    que recebe um único argumento,
  • 0:41 - 0:48
    e então desenha uma imagem baseada
    nas propriedades x e y dos objetos.
  • 0:48 - 0:52
    e um título de acordo com as
    propriedades apelido e idade do objeto.
  • 0:53 - 0:58
    E agora embaixo finalmente, chamamos
    "drawWinston()" no adolescente e no adulto,
  • 0:58 - 1:00
    e isso é o que faz isso aparecer.
  • 1:01 - 1:06
    Bem legal. Agora, se vamos aqui,
    e olharmos para esses objetos.
  • 1:06 - 1:11
    veja que eles são muito parecidos.
  • 1:11 - 1:14
    Ambos tem as mesmas propriedades,
  • 1:14 - 1:17
    e ambos podem ser usados para
    chamar a função "drawWinston()."
  • 1:18 - 1:20
    Na verdade, se você para pra pensar,
  • 1:20 - 1:24
    ambos estão descrevendo
    um tipo Winston, certo ?
  • 1:24 - 1:28
    E podemos imaginar que talvez exista
    esse tipo abstrato de Winston no mundo.
  • 1:28 - 1:31
    e todo Winston tem os
    mesmos tipos de propriedades,
  • 1:31 - 1:36
    como apelido, idade, x e y.
  • 1:36 - 1:42
    e aqui o que fizemos foi criar
    duas instâncias de Winston
  • 1:42 - 1:45
    para descrever, um tipo único de Winston,
  • 1:45 - 1:48
    um é Winston adolescente e este um adulto.
  • 1:48 - 1:54
    Mas eles são realmente, bem parecidos,
    e sabe, há muitas coisas similares entre eles.
  • 1:55 - 1:57
    E, sabe, se você pensar nisso, há muito
    do modo como o mundo funciona também,
  • 1:57 - 2:01
    por isso temos esses tipos de objetos
    abstratos como humanos e pessoas.
  • 2:01 - 2:03
    e então somos apenas
    instâncias específicas
  • 2:03 - 2:05
    de objetos com nossas
    pequenas propriedades próprias .
  • 2:06 - 2:10
    Agora, nós podemos usar técnicas
    de orientação a objeto em JavaScript
  • 2:10 - 2:14
    para essas variáveis do Winston
  • 2:15 - 2:18
    são instâncias formais do objeto Winston,
  • 2:18 - 2:21
    eles sabem que eles
    compartilham essas propriedades.
  • 2:22 - 2:27
    Pra isso, a primeira coisa que precisamos
    fazer é descrever este tipo abstrato de Winston.
  • 2:28 - 2:30
    E faremos isso com uma variável
  • 2:31 - 2:32
    Você armazenará o tipo em uma variável.
  • 2:32 - 2:38
    Então var Winston, usaremos W maiúsculo, porque
    sempre iniciamos nossos objetos com maiúsculo,
  • 2:39 - 2:41
    e vamos configura-lo como uma função.
  • 2:42 - 2:46
    E essa função é um tipo especial que
    chamamos de "construtor da função"
  • 2:47 - 2:52
    porque é isso o que será executado toda vez
    que criarmos uma nova instância do Winston,
  • 2:52 - 2:57
    Se Quisermos criar um Winston
    adolescente ou adulto, chamaremos essa função.
  • 2:57 - 3:03
    Isso significa que essa função deverá receber
    qualquer argumento que precise saber,
  • 3:03 - 3:06
    afim de criar um Winston completo.
  • 3:06 - 3:11
    Nesse caso, precisa saber
    o apelido, idade, x e y.
  • 3:11 - 3:15
    Agora, uma vez que recebemos esses
    argumentos precisamos fazer algo com eles,
  • 3:15 - 3:21
    Precisamos na verdade associar
    a informação ao objeto Winston.
  • 3:21 - 3:25
    Usaremos uma nova
    palavra chave, chamada, "this".
  • 3:25 - 3:29
    E "this" se refere a
    instância atual do objeto.
  • 3:29 - 3:35
    Então, "this.nickname", a propriedade
    nickname do objeto é igual a
  • 3:35 - 3:38
    o que for passado para
    o construtor da função, ok ?
  • 3:38 - 3:45
    E "this.age" é igual idade que é
    passada, "this.x" é igual ao x e "this.y"
  • 3:46 - 3:48
    igual ao y da entrada.
  • 3:48 - 3:53
    Muito bem, agora temos este
    tipo abstrato chamado Winston,
  • 3:53 - 3:57
    e tem o construtor da função que
    usamos para create o novo Winston.
  • 3:57 - 3:59
    Vamos tentar usa-lo.
  • 4:00 - 4:02
    Vamos criar o Winston
    adolescente novamente,
  • 4:02 - 4:05
    mas dessa vez
    faremos "winstonTeen", igual,
  • 4:05 - 4:10
    e ao invés de chaves,
    usaremos igual "newWinston".
  • 4:10 - 4:14
    Estamos dizendo "Queremos criar
    uma nova instância do tipo Winston"
  • 4:14 - 4:21
    e então passaremos a informação
    necessária, "Winsteen", 15, 20, 50, ok ?
  • 4:22 - 4:26
    E então podemos deletar esse antigo,
    porque não precisamos mais.
  • 4:27 - 4:30
    Tudo bem ? E agora
    está criado o novo Winsteen.
  • 4:31 - 4:35
    E agora podemos fazer
    "winstonAdult = new Winston()"
  • 4:35 - 4:39
    e é claro o nome dele é
    "Mr. Winst-a-lot", bom nome,
  • 4:40 - 4:43
    e ele tem 30 anos, e a posição é 229 e 50.
  • 4:44 - 4:47
    Tudo bem ? E então
    podemos deletar esse objeto.
  • 4:47 - 4:51
    E, nosso código ainda funciona.
  • 4:51 - 4:52
    O que fizemos aqui
    foi o que eu disse certo,
  • 4:52 - 4:58
    há esse, e esse tipo de dado
    abstrato que são um Winston
  • 4:58 - 5:04
    e podemos criar novas instâncias que
    tem essas propriedades que são únicas deles.
  • 5:05 - 5:08
    E apenas lembraremos
    das propriedades dentro deles
  • 5:09 - 5:14
    E lembrando é muito importante. Você sabe
    que aqui dentro temos esse "this.nickname, this.age"
  • 5:14 - 5:20
    Se acidentalmente, não tiver essa idade,
    perceba que agora diz, "undifined"
  • 5:20 - 5:23
    É porque lá embaixo,
    essa função drawWinston,
  • 5:23 - 5:28
    aguarda todos os objetos serem
    informados, inclusive "age".
  • 5:28 - 5:30
    E se não colocarmos "this.age",
  • 5:31 - 5:34
    Não terá uma propriedade "age", certo ?
    Passamos para o construtor da função
  • 5:34 - 5:35
    Mas não fizemos nada com isso,
  • 5:35 - 5:39
    temos que incluir isto no objeto
    usando a palavra chave "this"
  • 5:39 - 5:40
    Vamos adicionar novamente.
  • 5:41 - 5:42
    Agora,você deve estar pensando,
  • 5:42 - 5:46
    Ok, você tem o um código que funciona
    e está fazendo essas mudanças.
  • 5:46 - 5:51
    Mas, sabe, o que
    fizemos já foi feito antes.
  • 5:51 - 5:52
    Mas aqui está a parte legal.
  • 5:52 - 5:56
    Agora, todo o nosso Winston
    usa o mesmo construtor.
  • 5:56 - 6:00
    Se quisermos, podemos
    mudar propriedades do Winston.
  • 6:01 - 6:02
    Todos os Winstons, aqui dentro.
  • 6:02 - 6:06
    Talvez "age", talvez
    queiramos mudar para "years old"
  • 6:06 - 6:07
    Podemos mudar apenas aqui,
  • 6:07 - 6:13
    e agora em todos os nossos Winstons
    ficará "15 years old", "30 years old", certo ?
  • 6:13 - 6:15
    Eles estão pegando
    a parte que é unica deles,
  • 6:15 - 6:17
    mas também está usando coisas que
    são compartilhadas entre eles.
  • 6:17 - 6:19
    E isso é a parte legal da
    programação orientada a objeto,
  • 6:19 - 6:23
    essa ideia que há esses
    tipos de objetos no mundo,
  • 6:23 - 6:26
    e você pode criar novas
    instâncias desses objetos.
  • 6:26 - 6:29
    E há coisas que são parecidas neles,
    como, todos tem a mesma propriedades,
  • 6:29 - 6:31
    e há coisas que são diferentes como,
  • 6:31 - 6:35
    essa propriedade na verdade tem um
    valor diferente dessa outra propriedade, certo ?
  • 6:35 - 6:40
    Mas então, podemos ter o mesmo
    comportamento, como chamar as mesmas funções.
  • 6:41 - 6:43
    e então usa-las de modo parecido.
  • 6:43 - 6:46
    Essa é uma das coisas legais em
    programação orientada a objeto.
  • 6:46 - 6:48
    mas como você verá, há mais coisas.
  • 6:48 - 6:50
    Então, fique ligado!
  • 6:50 - 6:51
    Legendado por [Valter Bigeli]
Title:
Tipos de Objeto (Versão vídeo)
Description:

more » « less
Video Language:
English
Duration:
06:51

Portuguese, Brazilian subtitles

Revisions Compare revisions