• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Combinando OO e Funcional em javascript de forma prática
 

Combinando OO e Funcional em javascript de forma prática

on

  • 2,652 views

 

Statistics

Views

Total Views
2,652
Views on SlideShare
1,895
Embed Views
757

Actions

Likes
2
Downloads
41
Comments
0

8 Embeds 757

http://www.milfont.org 706
http://coderwall.com 22
http://feeds.feedburner.com 12
http://us-w1.rockmelt.com 7
http://paper.li 5
https://twitter.com 3
http://twitter.com 1
http://www.newsblur.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as OpenOffice

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Combinando OO e Funcional em javascript de forma prática Combinando OO e Funcional em javascript de forma prática Presentation Transcript

    • Antes de começar...
    • > typeof NaN === "number" true >
    • > "1" == 1 true > "1" === 1 false >
    • > typeof [] 'object' > Object.prototype.toString.call([]) '[object Array]'
    • Tipos dinâmicos
    • Tipos fracos Tipos dinâmicos
    • Tipos fracos Tipos dinâmicos Orientado a protótipos
    • Tipos fracos Tipos dinâmicos Orientado a protótipos Não tem classes
    • Tipos fracos Tipos dinâmicos Orientado a protótipos Não tem classes Não tem interfaces
    • Tipos fracos Tipos dinâmicos Orientado a protótipos Não tem classes Não tem interfaces Não tem packages
    • Tipos fracos Tipos dinâmicos Orientado a protótipos Não tem classes Não tem interfaces Não tem packages Não tem contexto Private
    • Tipos fracos Tipos dinâmicos Orientado a protótipos Não tem classes Não tem interfaces Não tem packages Não tem contexto Private Não tem contexto Protected
    • Não tem métodos
    • ECMA 262, 3rd Edition, December 1999), página 2 (4.2): "An ECMAScript object is an unordered collection of properties each with zero or more attributes..."
    • ECMA 262, 3rd Edition, December 1999), página 2 (4.2): "... and a method is a function associated with an object via a property. "
    • ECMA 262, 5.1 Edition, June 2011), página 2 (4.2): "… A function that is associated with an object via a property is a method . "
    • ECMA 262, 5.1 Edition, June 2011), página 2 (4.2): "… A function that is associated with an object via a property is a method . " ECMA 262, 3rd Edition, December 1999), página 2 (4.2): "... and a method is a function associated with an object via a property. "
    • Objeto Literal > var objeto = { ... propriedade: "Propriedade" ... } > objeto { propriedade: 'Propriedade' } >
    • Objeto Literal > var objeto = { ... propriedade: "Propriedade" ... } > objeto { propriedade: 'Propriedade' } > JSON?
    • Tudo é objeto? > 1.0.toString(); '1' >
    • Tudo é objeto? > 1.toString(); ...
    • Tudo é objeto?
    • Feita em 10 dias
    • https://twitter.com/#!/diveintomark/status/112607722704343040
    • Como se divertir com uma linguagem dessas?
    • Combinando Programação funcional e Orientação a Objetos em Javascript de forma prática @cmilfont QCon São Paulo 2011
    • Minimalismo e Simplicidade
    • > var empresa = { ... denominacaoSocial: "Milfont Evil Corp" ... } > empresa.cnpj === " 9999999999999" } false >
    • > var empresa = { ... denominacaoSocial: "Milfont Evil Corp" ... } > empresa.cnpj === " 9999999999999" } false > empresa.endereco.sede === "Capitolio" TypeError: Cannot read property 'sede' of undefined
    • > if(empresa.endereco && empresa.endereco.sede && empresa.endereco.sede.numero === "Capitolio")
    • ruby-1.8.7-p330 :012 > empresa.try(:endereco).try(:sede) => nil ruby-1.8.7-p330 :012 > empresa.try(:endereco).try(:sede) == " teste" => false
    • > Object.prototype. try = function(){}; > empresa.try( "empresa.endereco.sede.numero " );
    • > Object. prototype . try = function(){}; > empresa.try( "empresa.endereco.sede.numero " );
    • Object.defineProperty(Object.prototype, " try " , { value: function(){} } );
    • Object. defineProperty (Object.prototype, " try " , { value: function(){} } );
    • Problemas de Extender built-in https://github.com/kriskowal/es5-shim
    • Object.defineProperty(Object.prototype, " try " , { value: function(){} } );
    • Object.defineProperty(Object.prototype, " try " , { value: function(){} } );
    • Object.defineProperty(Object.prototype, " try ing " , { value: function(){} } );
    • var markup = &quot;<div id=&quot; &quot; + id + &quot;&quot;> </div>&quot;;
    • markup = &quot;<div id=&quot; #{id} &quot;> </div>&quot;;
    • var markup = &quot;<div id=&quot; #{id} &quot;> </div>&quot;;
    • Object.defineProperty(String.prototype, 'interpolate', { enumerable: false , value: function (values, pattern) { var pattrn = pattern || /#{([^}]+)}/g ; return this .replace(pattrn, function (match, value){ var result = values[value]; return (result)? result: &quot;&quot;; }); } });
    • https://github.com/documentcloud/underscore
    • DRY
    • var empresa = { nome: $( &quot;input #nome &quot; ) , endereco: $(&quot;input#endereco&quot;) }); jQuery.ajax({ data : empresa, cache : false, dataType : 'json', error : error, contentType : &quot;application/json&quot;, headers : {&quot;Content-Type&quot;:&quot;application/json&quot;, &quot;Accept&quot;:&quot;application/json&quot;}, success : callback, type : &quot;POST&quot; , url : &quot;/empresas&quot; });
    • var empresa = { nome: $( &quot;input #nome &quot; ) , endereco: $(&quot;input#endereco&quot;) }); jQuery.ajax({ data : empresa, cache : false, dataType : 'json', error : error, contentType : &quot;application/json&quot;, headers : {&quot;Content-Type&quot;:&quot;application/json&quot;, &quot;Accept&quot;:&quot;application/json&quot;}, success : callback, type : &quot; POST &quot; , url : &quot; /empresas &quot; });
    • class EmpresasController < ApplicationController end jQuery.ajax({ data : empresa, type : &quot; POST &quot; , url : &quot; /empresas &quot; });
    • class EmpresasController < ApplicationController end rake routes POST /empresas(.:format) {:action=>&quot;create&quot;, :controller=>&quot;empresas&quot;} jQuery.ajax({ data : empresa, type : &quot; POST &quot; , url : &quot; /empresas &quot; });
    • class EmpresasController < ApplicationController end rake routes POST /empresas (.:format) {:action=>&quot; create &quot;, :controller=>&quot; empresas &quot;} jQuery.ajax({ data : empresa, type : &quot; POST &quot; , url : &quot; /empresas &quot; });
    • class EmpresasController < ApplicationController end rake routes POST /empresas (.:format) {:action=>&quot; create &quot;, :controller=>&quot; empresas &quot;} var empresas = new EmpresasController empresas. create ( empresa , callback) jQuery.ajax({ data : empresa, type : &quot; POST &quot; , url : &quot; /empresas &quot; });
    • var empresa = { nome: $( &quot;input #nome &quot; ) , endereco: $(&quot;input#endereco&quot;) }); jQuery.ajax({ data : empresa, cache : false, dataType : 'json', error : error, contentType : &quot;application/json&quot;, headers : {&quot;Content-Type&quot;:&quot;application/json&quot;, &quot;Accept&quot;:&quot;application/json&quot;}, success : callback, type : &quot;POST&quot; , url : &quot;/empresas&quot; });
    • var empresa = { nome: $( &quot;input #nome &quot; ) , endereco: $(&quot;input#endereco&quot;) }); var empresas = new EmpresasController empresas. create ( empresa , callback)
    • var empresas = new EmpresasController empresas. create ( empresa , callback); function EmpresasController() { this.create = function(){}; }
    • var empresas = new EmpresasController empresas. create ( empresa , callback); var Interface = { this.routes = { action : { url: &quot;/controller&quot; , method: &quot;POST&quot; } };
    • var empresas = new EmpresasController empresas. create ( empresa , callback); function EmpresasController() { this.create = function(){}; } var Interface = { this.routes = { action : { url: &quot;/controller&quot; , method: &quot;POST&quot; } };
    • var empresas = new EmpresasController empresas. create ( empresa , callback); function EmpresasController() { } EmpresasController. prototype = DJR; var Interface = { this.routes = { action : { url: &quot;/controller&quot; , method: &quot;POST&quot; } };
    • function EmpresasController() { } EmpresasController. prototype = DJR;
    • function EmpresasController() { DJR.call(this); }
    • function EmpresasController() { this.useDJR = DJR; this.userDJR(); }
    • function EmpresasController() { DJR.call(this); } var InterfaceDJR = function(){ this.routes = { create : { url: &quot;/controller&quot; , method: &quot;POST&quot; } } }; EmpresasController.prototype = InterfaceDJR ;
    • function EmpresasController() { DJR.call(this); } var DJR = function() { this .ajax = function(object, callback, error, method, url, params) { jQuery.ajax({ context : self, data : object, cache : false, dataType : 'json', error : error, success : callback, type : method, url : url }); }; };
    • var DJR = function() { this.ajax = function(action, args) { var json = args[0]; var callback = args[1]; $.ajax({ url: this.route[action].url, type: this.route[action].method, data: JSON.stringify(json) }); } this. __noSuchMethod__ = function(){ this.ajax(arguments[0], arguments[1]); } };
    • var DJR = function() { }; DJR.algumMetodo = function(){}; DJR['algumMetodo'] = function(){};
    • var DJR = function() { this.ajax = function(action, args) { } for (var action in this.route) { this[action] = function() { this.ajax(act,arguments); } }; };
    •  
    • var DJR = function() { this.ajax = function(action, args) { } for (var action in this.route) { this[action] = function( act ){ return function() { this.ajax(act,arguments); } } (action) ; }; };
    • var empresa = { nome: $( &quot;input #nome &quot; ) , endereco: $(&quot;input#endereco&quot;) }); var empresas = new EmpresasController empresas. create ( empresa , callback)
    • var empresa = $(&quot;form#empresas&quot;).getJSON() ; var empresas = new EmpresasController empresas. create ( empresa , callback)
    • sammy.post('#empresas', function() { var empresa = $(&quot;form#empresas&quot;).getJSON() ; new EmpresasController() . create ( empresa , callback) });
    • var valorDosDebitos = lancamento.partidas .filter(function(partida){ return partida.natureza === Partida.DEBITO; }).map(function(partida){ return partida.valor; }).reduce(function(previousValue, currentValue, index, array){ return previousValue + currentValue; }, 0);