Javascript Everywhere

  • 895 views
Uploaded on

 

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
895
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
36
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. JavaScript Everywhere Thiago Silva <tsilva@sourcecraft.info>
  • 2. Road map • A linguagem, atualmente ­ ECMA­262, 3ed. – Meta­programação • A linguagem, amanhã ­ ECMA­262, 4ed. • Implementações – SpiderMonkey (Mozilla C) – Rhino (Mozilla Java) – Tamarin (Mozilla C++) – QSA (Qt C++) – KJS (KDE C++) 2 09/18/07  
  • 3. Recapitulando... • JavaScript/JScript/ActionScript/ECMAScript • Criada em 1995 para o Netscape 2 • Padronizada como ECMA­262 (1997) • Última versão: ECMA­262, 3ª edição (2000) • ECMA­357 (E4X) quot;I intended to actually use Scheme...quot; ­ Brendan Eich 3 09/18/07  
  • 4. Fast Overview • Object oriented (protoype based) Functional • • Java­like syntax Garbage collected • Dynamically typed • 4 09/18/07  
  • 5. O que é, o que é... 5 09/18/07  
  • 6. Built in 6 09/18/07  
  • 7. Orientação à Objeto 7 09/18/07  
  • 8. Natureza dos JS objects 8 09/18/07  
  • 9. Natureza dos JS objects 9 09/18/07  
  • 10. Natureza dos JS objects 10 09/18/07  
  • 11. Natureza dos JS objects 11 09/18/07  
  • 12. Object properties var palestra    = new Object; palestra.titulo = quot;JavaScript Everywherequot;; palestra.evento = quot;LinuxChixquot;; //E, com notação literal: var palestra = {   titulo: quot;JavaScript Everywherequot;,   evento: quot;LinuxChixquot; }; 12 09/18/07  
  • 13. Object properties //Duas notações para acessar propriedades palestra.titulo === palestra[quot;tituloquot;] //Exceto quando a chave for um número... var obj = new Object; obj[0] = quot;boooquot;; obj[0] === obj.0; //Uops! 13 09/18/07  
  • 14. Object properties //Eval é caro... eval(quot;pessoa.quot; + key + quot; = quot; + val); //Que tal... pessoa[key] = val; 14 09/18/07  
  • 15. Functions //Uma declaração comum function soma(x, y) {   return x + y; } //Alternativa var soma = new Function(quot;xquot;, quot;yquot;, quot;return x + yquot;); print(soma.length); // 2 var f = function() {   arguments.callee(); //recursividade } 15 09/18/07  
  • 16. (First­class) Functions //Declaração comum function soma(x, y) {   return x + y; } function aplique(func, x, y) {   func(x, y); } aplique(soma, 1, 2); 16 09/18/07  
  • 17. This, that... print(this); //Global object 17 09/18/07  
  • 18. This, that... function f() {   print(this); //depende! } f(); //this == Global object 18 09/18/07  
  • 19. This, that... function f() {   print(this); //depende! } var obj = new Object; obj.func = f; obj.func(); //this == obj palestra.g = f; palestra.g(); //this == palestra 19 09/18/07  
  • 20. Herança? • Toda função é uma construtora de objetos • Toda função tem uma propriedade chamada “prototype” • Object, Function, String, Array, etc são funções • Prototype, por default, aponta para Object.prototype (o objeto  primordial) 20 09/18/07  
  • 21. Anatomia 21 09/18/07  
  • 22. Herdando... function Pessoa() {}; Function Empregado(){}; Empregado.prototype = new Pessoa(); emp = new Empregado(); 22 09/18/07  
  • 23. Extendendo //Extendendo (sem especializar) classes built in String.prototype.ultimoCaractere = function() {   return this[this.length­1]; } quot;thiagoquot;.ultimoCaractere(); 23 09/18/07  
  • 24. Extendendo Array.prototype.each = function(func) {   for (var i = 0; i < this.length; i++) {      func(this[i])   } } [10,7,8].each(function(v) {   print(v); //10, 7, 8 }); 24 09/18/07  
  • 25. Closures function f() {   var local = 99;   return function() {     print(local);   } } f()(); //exibe 99 25 09/18/07  
  • 26. Currying Functions • Heim?!? 26 09/18/07  
  • 27. Currying Functions function soma(a,b,c){   if (arguments.length < this.soma.length) {     return curry(this.soma,arguments,this);   }   return a+b+c; }    print(add()(1,2,4));      // 7 print(add(1)(2)(5));      // 8 print(add(1)()(2)()(6));  // 9 print(add(1,2,7,8));      // 10 27 09/18/07  
  • 28. Fluent Interfaces //Versão normótica de um código:     function makeOrder(customer) {         var o1 = new Order();         customer.addOrder(o1);         var video = Video.find(quot;The Simpsonsquot;);         o1.addItem(video);         video = Video.find(quot;300quot;);         o1.addItem(video);         video = Video.find(quot;Transformersquot;);         video.setSkippable(true);         o1.addItem(video);         o1.setRush(true);     } 28 09/18/07  
  • 29. Fluent Interfaces //Nova versão   function makeFluent(customer) {         customer.newOrder().             withVideo(quot;The Simpsonsquot;).             withVideo(quot;300quot;).             withVideo(quot;Transformersquot;).skippable().             priorityRush();   } 29 09/18/07  
  • 30. Metaprogramming • O ato de escrever programas que escrevem programas • O ato de programar as estruturas da linguagem do programa 30 09/18/07  
  • 31. DOM high­level show(quot;us­state­fieldquot;). when(quot;countryquot;). is(quot;United Statesquot;); show(quot;province­fieldquot;). when(quot;countryquot;). is(quot;Canadaquot;); show(quot;brutusquot;). when(quot;us­statequot;). is(quot;Ohio, Michiganquot;); 31 09/18/07  
  • 32. REST? var eric = User.find(1) //GET http://localhost:3000/users/1.xml   var floyd = User.create({ name: quot;Floyd Wrightquot;,  email: quot;tfwright@thoughtbot.comquot;}); //POST http://localhost:3000/users.xml   var chad = User.build({ email: quot;cpytel@thoughtbot.comquot;,  name: quot;Chad Pytelquot;}); chad.save(); //POST ... 32 09/18/07  
  • 33. Classes Object.subclass({   nome: quot;Pessoaquot;,   atributos: [quot;nomequot;, quot;emailquot;],   metodos: {     getNome: function() {       return this.nome;     },     setNome: function(nome) {       this.nome = nome;     }   } }); Pessoa.new().setNome(quot;thiagoquot;); 33 09/18/07  
  • 34. JavaScript on Rails? ActiveRecord.subclass({   name: quot;Pessoaquot;,   has_many: [quot;livrosquot;, quot;comprasquot;],   validates_presence_of: [quot;senhaquot;],   class_methods: {     login: function(u,p) {       this.find(quot;allquot;, {           conditions: [[quot;usernamequot;, u], [quot;passwordquot;,p]],           limit: 1,           orderby: quot;id DESCquot;       }); }}}); 34 09/18/07  
  • 35. Enquanto isso, na sala da  justiça... 35 09/18/07  
  • 36. ECMAScript edition 4 • Fases finais • quot;Compatibilidadequot; com a ed. 3 • Microsoft + Mozilla + Adobe + etc + comunidade • Foco em Programming in the large • Um zilhão de adições 36 09/18/07  
  • 37. Que adições? 37 09/18/07  
  • 38. Classes public dynamic class Array extends Object {   public static CASEINSENSITIVE = 1   private static function toString() {     ...   }   function join(sep) {      ...   } } 38 09/18/07  
  • 39. Static typing (opcional) var nome : String = “thiago”; function f(a: int, b: Pessoa) : int {  ... } 39 09/18/07  
  • 40. Type parameters (generics) class List<T> {  public add(e: T) { ... }  ... } var pessoas : List<Pessoa>; 40 09/18/07  
  • 41. Block Expressions let (x=x+10, y=12) {   print(x+y); } print( let (k=k+10, z=12)                 (k+z, quot;hello, world!quot;) ) for ( let i=0 ; i < 5 ; i++ )   f(i) 41 09/18/07  
  • 42. Namespaces namespace debug namespace release debug function trace(s) { print(s) } release function trace(s) { /* do nothing */ }   use namespace debug trace(quot;I will be printed!quot;) function f() {   use namespace release   trace(quot;I won't be printed!quot;) } 42 09/18/07  
  • 43. Packages package mx.core  {     class UIObject extends ... } import acme.core.* var widget : acme.core.Widget 43 09/18/07  
  • 44. Iterators & Generators (+ destr. assignment) function fib() {   let i = 0, j = 1;   while (true) {     yield i;     [i, j] = [j, i + j];   } }   var g = fib(); for (var i = 0; i < 10; i++)   print(g.next()); 44 09/18/07  
  • 45. Alternative Closure Syntax function(x)x function(a,b)[g(),h()] foo(function(x)x,function(y)y,3) 45 09/18/07  
  • 46. Built­in • Classes nativas escritas em JavaScript • Self­hosted – Compilador – Type­checker 46 09/18/07  
  • 47. Outras adições... • [[DontEnum]] visível Proper tail calls • • Switch class Tripple quote strings & String.trim() • Catchalls & getters/setters • • Operator overloading 47 09/18/07  
  • 48. E mais outras... • Meta objects JSON encoding/decoding • • Stack inspection Bug fixes • arguments typeof Array • • eval como operador this bindings • 48 09/18/07  
  • 49. E mais outras.. 49 09/18/07  
  • 50. Implementações • SpiderMonkey (Mozilla C) Rhino (Mozilla Java) • • Tamarin (Mozilla C++) QSA (Qt C++) • KJS (KDE C++) • 50 09/18/07  
  • 51. Concluíndo • JS é uma linguagem que surpreende muita gente • É pequena, o que a torna sedutora para ser embutida em aplicações • A nova edição, provavelmente, surpreenderá mais ainda. 51 09/18/07  
  • 52. Obrigado • E­Mail: tsilva@sourcecraft.info • Jabber: tsilva@jabber­br.org • Blog: http://www.sourcecraft.info/blog 52 09/18/07