JavaScriptprototipação, closure e encapsulamento
@sr_valeriano• Desenvolvedor e Instrutor na Caelum• ricardo.valeriano@caelum.com.br
(oh yes, I wen’t there)
Object> mafagafo = new Object()> typeof(mafagafo)  “object”> pessoa = { }> typeof(pessoa)  ”object”
Properties> supimpa = { }> supimpa[‘agora-sim’] = ‘ (: ’> supimpa.awesome = ‘YaY!’> supimpa.tudo-batuta = ‘oples’  x Refer...
Functions> coisinha = function() {}> typeof(coisinha)  “function”> coisinha[‘sera?’] = ‘¬¬’> coisinha[‘sera?’]  ‘¬¬’
Functions são Objects> meChama = function(what) {  console.log(what);  console.log(typeof(this));}> meChama(“lágrimaAAs”) ...
Prototype> Object.prototype   Object> go = {}> go.say   undefined> Object.prototype.say = function() {   console.log(‘no, a...
classe?????> mafagafo = new Object()> typeof(mafagafo)  “object”> typeof(Object)  “function”
Object Prototype> Object.prototype.say = function() {   console.log(‘no, and no, and no’);}
Herança> Construtor = function() { };> parent = {id:’2’};> Construtor.prototype = parent;> child = new Construtor();> cons...
Escopo> mundo = {eh: ‘global’}> pessoa = {     miolos:function() {       var pensa = function() {         console.log(‘o m...
Escopo> pessoa = {     miolos:function() {        var pensa = function() {          console.log(‘Estou escondida!’);      ...
Referências
Referência> cabeca = (function() {      var ideias = {uma:‘social network’};      return {        getIdeias:function() {  ...
Referência> cabeca = (function() {      var ideias = {uma:‘social network’};      return {        getIdeias:function() {  ...
Closure> contexto = function() {  var bijeto = { go: ‘go’ }  var elefante = function() {    console.log(bijeto[“go”]);  } ...
Encapsulamento> cabeca = function() {   var ideias = {uma:‘social network’};   return {     getIdeias:function() {       r...
É isso! Obrigadasso.      @sr_valerianoricardo.valeriano@caelum.com.br
JavaScript: prototipação, closure e encapsulamento
JavaScript: prototipação, closure e encapsulamento
JavaScript: prototipação, closure e encapsulamento
JavaScript: prototipação, closure e encapsulamento
Upcoming SlideShare
Loading in …5
×

JavaScript: prototipação, closure e encapsulamento

2,747 views

Published on

Lightning talk feito no QConSP 2011.

Published in: Technology
1 Comment
3 Likes
Statistics
Notes
No Downloads
Views
Total views
2,747
On SlideShare
0
From Embeds
0
Number of Embeds
13
Actions
Shares
0
Downloads
29
Comments
1
Likes
3
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • A mais mal compreendida das linguagens, malditos form validations.\nTem mais boas partes do que parece.\n
  • A mais mal compreendida das linguagens, malditos form validations.\nTem mais boas partes do que parece.\n
  • É muito simples criar um objeto em javascript (object literal)\n
  • Um objeto pode ter propriedades, dot-notation funciona sob certas condições...\n
  • Funções são, na verdade, objetos.\nObjetos podem ter propriedades, que podem ser funções.\nPodem ser invocadas via sintaxe especial...\n
  • guardo em variáveis e invoco com o método apply.\n
  • JavaScript tem mecanismo de herança SIM, várias formas de implementar isso, uma delas é via prototipagem\n
  • Podemos adicionar propriedades dinamicamente a um objeto, mesmo que ele já exista.\n
  • Não existem classes em javascript, Object na verdade é uma função\n
  • Alteramos o prototype de Object, que na verdade é uma função...\n\nE todo objeto tem referência oculta a esse prototype, por isso agora todo objeto tem a função say.\n
  • Por isso é possível fazer alterando o prototype de uma função e construindo objetos dela.\n
  • Toda variável criada fora de uma função (ou sem a palavra var) é global.\n
  • só dentro da função miolos é possível acessar a função pensa.\nescopo de função\n
  • Todo objeto javascript é passado via referência, sem cópias quando passado como param.\n
  • Se alterarmos um objeto que foi retornado, ainda que ele esteja escondido pelo escopo de função, vamos alterar a referência.\n
  • Podemos nos aproveitar da memória...\nUma função se lembra o contexto onde foi criada. CLOSURE.\n
  • o objeto elefante se lembra do objeto bijeto\n
  • Agora tem outras questões (tá criando muito objetos). Mas funfa =)\n
  • \n
  • JavaScript: prototipação, closure e encapsulamento

    1. 1. JavaScriptprototipação, closure e encapsulamento
    2. 2. @sr_valeriano• Desenvolvedor e Instrutor na Caelum• ricardo.valeriano@caelum.com.br
    3. 3. (oh yes, I wen’t there)
    4. 4. Object> mafagafo = new Object()> typeof(mafagafo) “object”> pessoa = { }> typeof(pessoa) ”object”
    5. 5. Properties> supimpa = { }> supimpa[‘agora-sim’] = ‘ (: ’> supimpa.awesome = ‘YaY!’> supimpa.tudo-batuta = ‘oples’ x ReferenceError
    6. 6. Functions> coisinha = function() {}> typeof(coisinha) “function”> coisinha[‘sera?’] = ‘¬¬’> coisinha[‘sera?’] ‘¬¬’
    7. 7. Functions são Objects> meChama = function(what) { console.log(what); console.log(typeof(this));}> meChama(“lágrimaAAs”) lágrimaAAs “object”> meChama.apply(nil, [“lágrimaAAs”]) lágrimaAAs “object”
    8. 8. Prototype> Object.prototype Object> go = {}> go.say undefined> Object.prototype.say = function() { console.log(‘no, and no, and no’);}> go.say function() { ... }> go.say() no, and no, and no> go.toString()
    9. 9. classe?????> mafagafo = new Object()> typeof(mafagafo) “object”> typeof(Object) “function”
    10. 10. Object Prototype> Object.prototype.say = function() { console.log(‘no, and no, and no’);}
    11. 11. Herança> Construtor = function() { };> parent = {id:’2’};> Construtor.prototype = parent;> child = new Construtor();> console.log(child.id) 2
    12. 12. Escopo> mundo = {eh: ‘global’}> pessoa = { miolos:function() { var pensa = function() { console.log(‘o mundo é:’+ mundo.eh); } pensa(); }}> pessoa.miolos() “o mundo é global”> pensa undefined
    13. 13. Escopo> pessoa = { miolos:function() { var pensa = function() { console.log(‘Estou escondida!’); } pensa(); }}> pessoa.miolos() Estou Escondida!> pensa undefined
    14. 14. Referências
    15. 15. Referência> cabeca = (function() { var ideias = {uma:‘social network’}; return { getIdeias:function() { return ideias; } }})();> ideias undefined> cabeca.getIdeias() {uma:‘social network’}> cabeca.getIdeias().outra = ‘javascript’> cabeca.getIdeias() {uma:‘social network’, outra:‘javascript’}
    16. 16. Referência> cabeca = (function() { var ideias = {uma:‘social network’}; return { getIdeias:function() { return ideias; } }})();> ideias undefined> cabeca.getIdeias() {uma:‘social network’}> cabeca.getIdeias().outra = ‘javascript’> cabeca.getIdeias() {uma:‘social network’, outra:‘javascript’}
    17. 17. Closure> contexto = function() { var bijeto = { go: ‘go’ } var elefante = function() { console.log(bijeto[“go”]); } elefante();}> console.log( contexto() ) go
    18. 18. Encapsulamento> cabeca = function() { var ideias = {uma:‘social network’}; return { getIdeias:function() { return Object.create(ideias); } }};> cabeca.getIdeias() {uma:‘social network’}> cabeca.getIdeias().outra = ‘javascript’> cabeca.getIdeias() {uma:‘social network’}
    19. 19. É isso! Obrigadasso. @sr_valerianoricardo.valeriano@caelum.com.br

    ×