Budapest.JS előadás, 2013.01.14. Egy egyszerű osztály létrehozása CoffeeScriptben és TypeScripben (és a JavaScript megfelelőjének összehasonlítása).

1. Osztályozzunk!
(***Script demo)
Farkas Máté
Budapest.js, 2013. január 14.

2. Eltökélten…
„The determined Real Programmer can write
FORTRAN programs in any language.”
(Ed Post, Real Programmers Don't Use Pascal, 1982)

3. Eltökélten…
„The determined Real Programmer can write
FORTRAN programs in any language.”
(Ed Post, Real Programmers Don't Use Pascal, 1982)
Mi eltökélt JavaScript programozók vagyunk!

4. Eltökélten…
„The determined Real Programmer can write
FORTRAN programs in any language.”
(Ed Post, Real Programmers Don't Use Pascal, 1982)
Mi eltökélt JavaScript programozók vagyunk?

5. Eltökélten…
„The determined Real Programmer can write
FORTRAN programs in any language.”
(Ed Post, Real Programmers Don't Use Pascal, 1982)
Mi eltökélt JavaScript programozók vagyunk?
Miről lesz szó?

6. Eltökélten…
„The determined Real Programmer can write
FORTRAN programs in any language.”
(Ed Post, Real Programmers Don't Use Pascal, 1982)
Mi eltökélt JavaScript programozók vagyunk?
Miről lesz szó?
Dart

7. Eltökélten…
„The determined Real Programmer can write
FORTRAN programs in any language.”
(Ed Post, Real Programmers Don't Use Pascal, 1982)
Mi eltökélt JavaScript programozók vagyunk?
Miről lesz szó?
Dart, CoffeeScript, TypeScript

8. Az eszközök bemutatása
Néhány szót a demóban használt nyelvekről:

9. Az eszközök bemutatása
Néhány szót a demóban használt nyelvekről:
CoffeeScript: The golden rule of CoffeeScript is:
"It's just JavaScript".

10. Az eszközök bemutatása
Néhány szót a demóban használt nyelvekről:
CoffeeScript: The golden rule of CoffeeScript is:
"It's just JavaScript".
TypeScript: TypeScript is a typed superset of
JavaScript that compiles to plain JavaScript.

11. Az eszközök bemutatása
Néhány szót a demóban használt nyelvekről:
CoffeeScript: The golden rule of CoffeeScript is:
"It's just JavaScript".
TypeScript: TypeScript is a typed superset of
JavaScript that compiles to plain JavaScript.
TypeScript offers classes, modules, and
interfaces to help you build robust components.

12. „Üdvözlő program egység”
A feladat: egy üdvözlést végző program egység
elkészítése.
Első kör: az egységet az üdvözlés szövegével
inicializáljuk, majd megadhatjuk, hogy milyen
nevet üdvözöljön.
Második kör: az előzőt szeretnénk tovább-
fejleszteni úgy, hogy előre meg kelljen adni a
neveket, amiket adott hívásra üdvözölni fog.

13. DEMO
DEMO
https://gist.github.com/4537998

14. CoffeeScript vs. TypeScript
CoffeeScript TypeScript
class Greeter class Greeter {
constructor: (@greeting) -> constructor(public greeting: string) {}
greet: (name) -> greet(name: string) {
console.log @greeting + name console.log(this.greeting + name);
}
}
class AllGreeter extends Greeter class AllGreeter extends Greeter {
constructor: (greeting, @names) -> constructor(greeting: string,
super greeting public names : string[]) {
super(greeting)
}
greetAll: () -> greetAll() {
@names.forEach (name) => this.names.forEach((name) => {
@greet(name) this.greet(name);
});
}
}

15. Generated JavaScripts

16. CoffeeScript vs. JavaScript
CoffeeScript JavaScript
class Greeter var AllGreeter, Greeter,
constructor: (@greeting) -> __hasProp = {}.hasOwnProperty,
__extends = function(child, parent) { for (var key in parent) { if
greet: (name) -> (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor()
{ this.constructor = child; } ctor.prototype = parent.prototype; child.prototype =
console.log @greeting + name
new ctor(); child.__super__ = parent.prototype; return child; };
class AllGreeter extends Greeter
Greeter = (function() {
constructor: (greeting, @names) ->
function Greeter(greeting) {
super greeting
this.greeting = greeting;
}
greetAll: () ->
@names.forEach (name) =>
Greeter.prototype.greet = function(name) {
@greet(name)
return console.log(this.greeting + name);
};
return Greeter;
})();
AllGreeter = (function(_super) {
__extends(AllGreeter, _super);
function AllGreeter(greeting, names) {
this.names = names;
AllGreeter.__super__.constructor.call(this, greeting);
}
AllGreeter.prototype.greetAll = function() {
var _this = this;
return this.names.forEach(function(name) {
return _this.greet(name);
});
};
return AllGreeter;
})(Greeter);

17. Folytatjuk…
Farkas Máté
Budapest.js, 2013. január 14.

18. Links
Az előadó:
• http://farkas-mate.hu/
• http://virtual-call-center.eu/
Amikről szó volt:
• http://coffeescript.org/
• http://www.typescriptlang.org/