JavaScript Everywhere
Thiago Silva
<tsilva@sourcecraft.info>

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

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)
\"I intended to actually use Scheme...\" ­ Brendan Eich
3
09/18/07

Fast Overview
• Object oriented (protoype based)
Functional
•
• Java­like syntax
Garbage collected
•
Dynamically typed
•
4
09/18/07

O que é, o que é...
5
09/18/07

Built in
6
09/18/07

Orientação à Objeto
7
09/18/07

Natureza dos JS objects
8
09/18/07

Natureza dos JS objects
9
09/18/07

Natureza dos JS objects
10
09/18/07

Natureza dos JS objects
11
09/18/07

Object properties
var palestra = new Object;
palestra.titulo = \"JavaScript Everywhere\";
palestra.evento = \"LinuxChix\";
//E, com notação literal:
var palestra = {
titulo: \"JavaScript Everywhere\",
evento: \"LinuxChix\"
};
12
09/18/07

Object properties
//Duas notações para acessar propriedades
palestra.titulo === palestra[\"titulo\"]
//Exceto quando a chave for um número...
var obj = new Object;
obj[0] = \"booo\";
obj[0] === obj.0; //Uops!
13
09/18/07

Object properties
//Eval é caro...
eval(\"pessoa.\" + key + \" = \" + val);
//Que tal...
pessoa[key] = val;
14
09/18/07

Functions
//Uma declaração comum
function soma(x, y) {
return x + y;
}
//Alternativa
var soma = new Function(\"x\", \"y\", \"return x + y\");
print(soma.length); // 2
var f = function() {
arguments.callee(); //recursividade
}
15
09/18/07

(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

This, that...
print(this); //Global object
17
09/18/07

This, that...
function f() {
print(this); //depende!
}
f(); //this == Global object
18
09/18/07

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

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

Anatomia
21
09/18/07

Herdando...
function Pessoa() {};
Function Empregado(){};
Empregado.prototype = new Pessoa();
emp = new Empregado();
22
09/18/07

Extendendo
//Extendendo (sem especializar) classes built in
String.prototype.ultimoCaractere = function() {
return this[this.length­1];
}
\"thiago\".ultimoCaractere();
23
09/18/07

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

Closures
function f() {
var local = 99;
return function() {
print(local);
}
}
f()(); //exibe 99
25
09/18/07

Currying Functions
• Heim?!?
26
09/18/07

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

Fluent Interfaces
//Versão normótica de um código:
function makeOrder(customer) {
var o1 = new Order();
customer.addOrder(o1);
var video = Video.find(\"The Simpsons\");
o1.addItem(video);
video = Video.find(\"300\");
o1.addItem(video);
video = Video.find(\"Transformers\");
video.setSkippable(true);
o1.addItem(video);
o1.setRush(true);
}
28
09/18/07

Fluent Interfaces
//Nova versão
function makeFluent(customer) {
customer.newOrder().
withVideo(\"The Simpsons\").
withVideo(\"300\").
withVideo(\"Transformers\").skippable().
priorityRush();
}
29
09/18/07

Metaprogramming
• O ato de escrever programas que escrevem programas
• O ato de programar as estruturas da linguagem do programa
30
09/18/07

DOM high­level
show(\"us­state­field\").
when(\"country\").
is(\"United States\");
show(\"province­field\").
when(\"country\").
is(\"Canada\");
show(\"brutus\").
when(\"us­state\").
is(\"Ohio, Michigan\");
31
09/18/07

REST?
var eric = User.find(1)
//GET http://localhost:3000/users/1.xml
var floyd = User.create({
name: \"Floyd Wright\",
email: \"tfwright@thoughtbot.com\"});
//POST http://localhost:3000/users.xml
var chad = User.build({
email: \"cpytel@thoughtbot.com\",
name: \"Chad Pytel\"});
chad.save(); //POST ...
32
09/18/07

Classes
Object.subclass({
nome: \"Pessoa\",
atributos: [\"nome\", \"email\"],
metodos: {
getNome: function() {
return this.nome;
},
setNome: function(nome) {
this.nome = nome;
}
}
});
Pessoa.new().setNome(\"thiago\");
33
09/18/07

JavaScript on Rails?
ActiveRecord.subclass({
name: \"Pessoa\",
has_many: [\"livros\", \"compras\"],
validates_presence_of: [\"senha\"],
class_methods: {
login: function(u,p) {
this.find(\"all\", {
conditions: [[\"username\", u], [\"password\",p]],
limit: 1,
orderby: \"id DESC\"
});
}}});
34
09/18/07

Enquanto isso, na sala da
justiça...
35
09/18/07

ECMAScript edition 4
• Fases finais
• \"Compatibilidade\" 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

Que adições?
37
09/18/07

Classes
public dynamic class Array extends Object
{
public static CASEINSENSITIVE = 1
private static function toString() {
...
}
function join(sep) {
...
}
}
38
09/18/07

Static typing
(opcional)
var nome : String = “thiago”;
function f(a: int, b: Pessoa) : int {
...
}
39
09/18/07

Type parameters
(generics)
class List<T> {
public add(e: T) { ... }
...
}
var pessoas : List<Pessoa>;
40
09/18/07

Block Expressions
let (x=x+10, y=12) {
print(x+y);
}
print( let (k=k+10, z=12)
(k+z, \"hello, world!\") )
for ( let i=0 ; i < 5 ; i++ )
f(i)
41
09/18/07

Namespaces
namespace debug
namespace release
debug function trace(s) { print(s) }
release function trace(s) { /* do nothing */ }
use namespace debug
trace(\"I will be printed!\")
function f() {
use namespace release
trace(\"I won't be printed!\")
}
42
09/18/07

Packages
package mx.core
{
class UIObject extends ...
}
import acme.core.*
var widget : acme.core.Widget
43
09/18/07

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

Alternative
Closure Syntax
function(x)x
function(a,b)[g(),h()]
foo(function(x)x,function(y)y,3)
45
09/18/07

Built­in
• Classes nativas escritas em JavaScript
• Self­hosted
– Compilador
– Type­checker
46
09/18/07

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

E mais outras...
• Meta objects
JSON encoding/decoding
•
• Stack inspection
Bug fixes
•
arguments typeof Array
•
• eval como operador
this bindings
•
48
09/18/07

E mais outras..
49
09/18/07

Implementações
• SpiderMonkey (Mozilla C)
Rhino (Mozilla Java)
•
• Tamarin (Mozilla C++)
QSA (Qt C++)
•
KJS (KDE C++)
•
50
09/18/07

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

Obrigado
• E­Mail: tsilva@sourcecraft.info
• Jabber: tsilva@jabber­br.org
• Blog: http://www.sourcecraft.info/blog
52
09/18/07