Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Desmistificando Herança e Protótipos no JS - Short

Desmistificando Herança e Protótipos no JS - Short

Lucas Santos

June 04, 2020
Tweet

More Decks by Lucas Santos

Other Decks in Programming

Transcript

  1. Desmistificando Herança e
    Prototypes no Javascript
    Sempre esteve lá, ninguém sabia o porquê

    View full-size slide

  2. $ whoami
    Lucas Santos
    /khaosdoctor
    @_staticvoid
    lsantos.me
    Cloud Advocate
    [email protected] @khaosdoctor

    View full-size slide

  3. trainingcenter.io
    2018.abcdevelopers.org

    View full-size slide

  4. Encapsulamento

    View full-size slide

  5. Polimorfismo

    View full-size slide

  6. Arrow functions
    não vão funcionar

    View full-size slide

  7. Herança nos dá isso

    View full-size slide

  8. Herança nos dá isso
    De onde veio isso?

    View full-size slide

  9. De onde as coisas vem?

    View full-size slide

  10. Tipos originais
    De onde tudo aparece

    View full-size slide

  11. String
    Number
    Object
    Array
    Func
    RegExp

    View full-size slide

  12. Como elas
    funcionam?

    View full-size slide

  13. Nunca toque no __proto__

    View full-size slide

  14. Object.Prototype
    Não. Não é a mesma coisa

    View full-size slide

  15. Prototype é um objeto de propriedades

    View full-size slide

  16. O famoso “new”

    View full-size slide

  17. Herança!
    Mas não é qualquer herança...

    View full-size slide

  18. Herança Prototípica

    View full-size slide

  19. Herança Prototípica

    View full-size slide

  20. Cadeias de protótipos
    Como eu sei o que eu quero?

    View full-size slide

  21. Cadeias de protótipos

    View full-size slide

  22. Cadeias de protótipos

    View full-size slide

  23. Cadeias de protótipos

    View full-size slide

  24. Cadeia de protótipos

    View full-size slide

  25. Cadeia de protótipos

    View full-size slide

  26. Cadeias de protótipos: a prática

    View full-size slide

  27. O fim da cadeia

    View full-size slide

  28. O fim da cadeia?

    View full-size slide

  29. E o “extends”?

    View full-size slide

  30. Extends: Exemplo

    View full-size slide

  31. O que eu faço
    com isso?

    View full-size slide

  32. 1. Métodos globais

    View full-size slide

  33. 2. Overload - Os problemas

    View full-size slide

  34. 3. Performance

    View full-size slide

  35. 3. Performance
    .print

    View full-size slide

  36. 3. Performance

    View full-size slide

  37. 3. Performance

    View full-size slide

  38. Referências
    - bit.ly/medium-prototypes
    - bit.ly/ecma-proto
    - mzl.la/mdn-proto
    - mzl.la/function-js
    - mzl.la/extends-jsx
    - bit.ly/encapsulamento-js
    - bit.ly/polimorfismo-js
    - bit.ly/this-js
    - bit.ly/imasters-smoosh

    View full-size slide

  39. /khaosdoctor @_staticvoid
    lsantos.me @khaosdoctor

    View full-size slide