Este documento describe el lenguaje de programación Ceylon y su compilador hacia JavaScript (Ceylon-JS). Ceylon es un lenguaje con tipado estático que puede compilar a Java o JavaScript. El compilador Ceylon-JS genera código JavaScript a partir del árbol sintáctico abstracto de Ceylon mediante varias fases como la asignación de tipos y la generación de código para el backend de JavaScript. El código JavaScript generado emula características de Ceylon como clases, tipos genéricos e inmutabilidad.

1. Enlighten your software
Diseño de compiladores:
un vistazo a Ceylon-JS
Enrique Zamudio López
@chochosmx

2. Ceylon
• Lenguaje con tipado estático
• Múltiples backends
• Java
• JavaScript
• Sistema de manejo de dependencias basado en
módulos

3. Ceylon
• Lenguaje con tipado estático
• Múltiples backends
• Java
• JavaScript
• Sistema de manejo de dependencias basado en
módulos

4. ¿Cómo funciona un
compilador?
print "hola"
1100100100011
1001010101100
1000101001010
0001011010101
?

5. Ceylon-JS
shared void run() =>
print("hola");
function run() {
m$1.print("hola");
}
ex$.run=run;?

6. ?

7. Frontend / Backend
B
F

8. Fases
321

9. Crear modelo
• Cargar modelo del módulo de lenguaje
• Cargar modelos foráneos sobre demanda
• Tenemos dos tipos especiales:
• Nothing
• Unknown

10. Parse
shared void run =>
print( )"hola" ;
()

11. ANTLR
Another Tool for Language Recognition
^(abstract MEMBER_OR_TYPE_EXPRESSION:PRIMARY
Reference target;
Declaration declaration;
List<Type> signature;
boolean ellipsis;
boolean directlyInvoked;
boolean assigned;
boolean staticMethodReference;
boolean staticMethodReferencePrimary;)

12. ANTLR
Another Tool for Language Recognition
NATURAL_LITERAL
: Digits
(
('.' ('0'..'9')) =>
'.' Digits (Exponent|Magnitude|FractionalMagnitude)? { $type =
FLOAT_LITERAL; }
| FractionalMagnitude { $type = FLOAT_LITERAL; }
| Magnitude?
)
| '#' HexDigits
| '$' BinaryDigits
;

13. Parse
shared void run =>
print( )"hola" ;
()

14. ANTLR
shared
void
run
print
()
"hola"
()

15. Asignar tipos
shared
run
print
()
"hola"
()
String
Anything
[Anything]
Anything
SharedAnnotation
[]

16. Abstract Syntax Tree
MethodDeclaration
AnnotationList
Annotation
Identifier
ParameterListLazySpecifierExpression
Expression
InvocationExpression
BaseMemberExpression
PositionalArgumentList
ListedArgument
Expression
BaseMemberExpression
Identifier
Identifier
StringLiteral

17. Visitor
visit(BaseMemberExpression that) {...}
visit(ClassDefinition that) {...}
visit(Comprehension that) {...}
visit(InvocationExpression that) {...}
visit(LazySpecifierExpression that) {...}
visit(MethodDeclaration that) {...}
visit(QualifiedTypeExpression that) {...}
visit(SequencedArgument that) {...}
visit(SpecifierStatement that) {...}
visit(StringLiteral that) {...}
visit(SumOp that) {...}

18. Frontend
Abstract Syntax Tree
AST validado, tipos asignados, referencias a
declaraciones, modelo completo

19. Backends
• Java
• JavaScript
• CeylonDoc
Cada backend genera y carga modelo en
formato accesible en tiempo de ejecución

20. Java Backend
• Modelo basado en anotaciones
• Utiliza javac para generar un AST en Java y
a partir de ahí, bytecode

21. CeylonDoc
• Usa cualquiera de los
dos modelos (JS/Java)
• Genera páginas HTML
a partir de las
anotaciones doc

22. JavaScript Backend
• Modelo en formato JSON
• Genera código JavaScript encapsulado en un
módulo en formato CommonJS

23. Abstract Syntax Tree
MethodDeclaration
AnnotationList
Annotation
Identifier
ParameterListLazySpecifierExpression
Expression
InvocationExpression
BaseMemberExpression
PositionalArgumentList
ListedArgument
Expression
BaseMemberExpression
Identifier
Identifier
StringLiteral

24. public void visit(final Tree.Block that) {
List<Statement> stmnts = that.getStatements();
if (stmnts.isEmpty()) {
out("{}");
} else {
beginBlock();
visitStatements(stmnts);
endBlock();
}
}
public void visit(final Tree.InOp that) {
box(that.getRightTerm());
out(".contains(");
if (!isNaturalLiteral(that.getLeftTerm())) {
box(that.getLeftTerm());
}
out(")");
}

25. public void visit(final Tree.ClassDefinition that) {
if (opts.isOptimize() &&
that.getDeclarationModel().isClassOrInterfaceMember())
return;
TypeGenerator.classDefinition(that, this);
}
public void visit(final Tree.Comprehension that) {
new ComprehensionGenerator(this, names,
directAccess).generateComprehension(that);
}
public void visit(final Tree.SequenceEnumeration that) {
SequenceGenerator.sequenceEnumeration(that, this);
}
public void visit(final Tree.ObjectArgument that) {
FunctionHelper.objectArgument(that, this);
}
public void visit(Tree.LetExpression that) {
FunctionHelper.generateLet(that, directAccess, this);
}

26. Ceylon JavaScript
• Funciones nivel tope
• Funciones orden
superior
• Referencias a
funciones
• Objetos
✓
✓
✓
✓

27. Ceylon JavaScript
• Tipado fuerte
• Clases, interfaces,
constructores, tipos
anidados
• Genéricos
• Reificados
• Metamodelo
• Inmutabilidad
• Scoping
• Invocaciones por
nombre
• Interpolación
• Expresiones inline
✕
✕
✕
✕
✕
😐
✕
✕
✕
😐

28. Ceylon JavaScript
• Comprensiones
• Múltiples listas de
parámetros
• Alias de tipos
• Singletons
✕
😐
✕
✕

29. Ceylon JavaScript
• this
• outer 😡

30. Ejemplo: Clase simple
shared class Ejemplo(uno, dos) {
shared String uno;
shared variable Integer dos;
shared String algo(String x) {
value z = "``uno`` y ``x``";
return z.uppercased;
}
shared Ejemplo clone() =>
Ejemplo(uno, dos);
}

31. Clase en JS
function Ejemplo(uno,dos,ejemplo$) {
$init$Ejemplo();
if(ejemplo$===undefined)
ejemplo$=new Ejemplo.$$;
ejemplo$.uno_=uno;
ejemplo$.dos_=dos;
return ejemplo$;
}

32. Clase en JS
Ejemplo.$crtmm$=function(){
return{
mod:$CCMM$,'super':{t:m$1.Basic},
ps:[
{nm:'uno',mt:'prm',$t:{t:m$1.$_String},pa:1},
{nm:'dos',mt:'prm',$t:{t:m$1.Integer},pa:1025}
],pa:1,d:['','Ejemplo']
};
};
ex$.Ejemplo=Ejemplo;

33. Clase en JS
function Ejemplo(uno,dos,ejemplo$) {
$init$Ejemplo();
if(ejemplo$===undefined)
ejemplo$=new Ejemplo.$$;
ejemplo$.uno_=uno;
ejemplo$.dos_=dos;
return ejemplo$;
}

34. Clase en JS
m$1.initTypeProto(Ejemplo,'Ejemplo',m$1.Basic);
...
m$1.atr$(ejemplo$,'dos',
function(){return this.dos_;},
function($2){return this.dos_=$2;},
function(){return{mod:...,$t:{t:m$1.Integer},$cont:Ejemplo,...};});
ejemplo$.algo=function($3){
var ejemplo$=this;
var $4="".plus(ejemplo$.uno).plus(" y ").plus($3).plus("");
return $4.uppercased;
};
ejemplo$.algo.$crtmm$=function(){return{mod:...,$t:{t:m$1.$_String},ps:[
{nm:'x',mt:'prm',$t:{t:m$1.$_String}}],$cont:Ejemplo,pa:1,d:
['','Ejemplo','$m','algo']};};

35. Inmutabilidad
m$1.atr$(ejemplo$,'uno',function(){return
this.uno_;},undefined,function(){return{mod:$CCMM$,$t:{t:m$1.$_String},
$cont:Ejemplo,pa:1,d:['','Ejemplo','$at','uno']};});
var x = Ejemplo("1",2);
x.uno="2";
x.uno=="2"; //false
x.dos=5;
x.dos==5; //true

36. Invocación por nombre
value x = Ejemplo {
dos = 5;
uno = "uno";
};
var $5=($6=(5),$7="uno",Ejemplo($7,$6));
var $6,$7;

37. Invocación con spread
value t=["uno",2];
value x=Ejemplo(*t);
var $5=m$1.tpl$(["uno",2],
m$1.mtt$([{t:m$1.$_String},{t:m$1.Integer}]));
var $6=Ejemplo($5.$_get(0), $5.$_get(1));

38. Referencia a Método
shared class Ejemplo(uno, dos) {
shared String uno;
shared variable Integer dos;
shared String algo<Algo>(Algo x)
given Algo satisfies Object {
value z = "``uno`` y ``x``";
return z.uppercased;
}
shared Ejemplo clone() =>
Ejemplo(uno, dos);
}

39. Referencia a Método
value o = Ejemplo("a",2);
value r1 = o.algo<Integer>;
value r2 = Ejemplo.algo<String>;
r1(1);
r2(o)("otra cosa");

40. Referencia a Método
value o = Ejemplo("a",2);
value r = Ejemplo.algo<String>;
r(o)("otra cosa");
var $5=Ejemplo("a",2);
var $6=m$1.$JsCallable(function(x){
return m$1.JsCallable(x,x.algo,
{Algo$algo:{t:m$1.$_String}});
},[{nm:'p2',mt:'prm',$t:{t:Ejemplo}}],
{Return$Callable:{t:m$1.Callable,a:{Return$Callable:{t:m$1.$_String},Arguments
$Callable:m$1.mtt$([{t:m$1.$_String}])}},Arguments$Callable:m$1.mtt$
([{t:Ejemplo}])});
$6($5)("otra cosa");

41. Enlighten your software
¿Preguntas?
@chochosmx
enrique@ceylon-lang.org
github.com/chochos