myPEAK.net Blog

Etwas verspätet, aber hier ist auch noch ein Rückblick zur FrOSCon von mir. Ein Vortrag den ich auf der FrOSCon sehr Interessant fand, war “Advanced JavaScript”.

Als Einstieg in das Thema stellte Sprecher “Konstantin Käfer” die Frage “Why JavaScript?”, die er auch gleich mit der einzig richtigen Antwort beantwortete: “You have to”.
Wir haben bei unserer Seite sehr viel mit JavaScript zu tun und sagen wir es mal so “Es ist nicht unsere Lieblingssprache”.

Der Vortrag war sehr gut strukturiert und meiner Meinung nach ein sehr guter Vortragsstil. Ein paar Tippfehler bei den Live-Demonstrationen hat das ganze auch noch sehr sympathisch gemacht.

Ich fasse die wichtige Punkte nochmal schnell zusammen:

Zur Aufwärmung wurden erstmal die Grundlagen geklärt.
Was ist der Unterschied zwischen JavaScript & DOM (da es oft verwechselt wird):
Die DOM hat nichts mit JavaScript zu tun, es ist nur eine “API”, um einen Zugriff auf die Webseite zu schaffen.

Was mir neu war, dass auch auf Server Seite JavaScript eingesetzt wird. Für mich unverständlich, warum nimmt man keine “richtige” Programmiersprache. Aber verwunderlich ist es auch nicht, da die Aussage “Weil man es kann” oft genug in der IT-Welt anzutreffen ist. Wenn man schon auf Druckern Musik macht, warum sollte man dann nicht auch versuchen Server-Software in JavaScript schreiben.

Danach wurden die grundlegenden Eigenschaften nochmal geklärt:
Funktionen: Mit Funktionen kann man in JavaScript so gut wie alles machen. Aufrufen, Parameter übergeben und Kapseln ist ja nichts besonderes. Aber Funktionen in Variablen speichern, sie als Parameter weitergeben und von Funktionen zurückgeben lassen, ist mir in der Java Welt fremd.

Prototype OOP: Da es in JavaScript keine Klassen gibt, werden Prototypes von Funktionen als Basis Klassen verwendet. (Ein Schnipsel Code sagt oft mehr als tausend Worte)

var Foo = function() { /* ... */ };
Foo.prototype = {
'bar': function() { /* ... */ },
'baz': function() { /* ... */ }
};
var instance = new Foo();
instance.bar();
instance.baz();


Auch können die Basis Klassen oder die Instanzen nachträglich, um Funktionen und Variablen erweitert werden. Was sich bei Änderung der Basis Klasse auch auf alle Instanzen auswirkt. Auch hierzu ein kleines Schnipsel:
Number.prototype.celsiusToFahrenheit = function() {
return (this * 9 / 5) + 32;
};
js> (34).celsiusToFahrenheit();
93.2
js> (0).celsiusToFahrenheit();
32


Es wurde noch ein kleiner Ausblick auf JavaScript 1.7 gegeben, was aber noch nicht von allen Browsern unterstützt wird.
Was ich sehr interessant fand, war die “yield” Möglichkeit, die Funktionen an einer bestimmten Stellen anhält und mit einem “.next()” Aufruf fortgesetzt werden kann.
Auch hierzu ein kleines Schnipsel aus den Folien des Vortrages:


function fib() {
var i = 0, j = 1;
while (true) {
yield i;
var t = i;
i = j;
j += t;
}
}
var g = fib();
for (var i = 0; i < 10; i++) {
print(g.next());
}


Unter dem Thema “Pattern & Techniques”, wurde die einzelne Pattern & Techniques erklaert und mit Beispielen veranschaulicht.
Zu den meines Erachtens interessanten geb ich ein Beispiel:
- Inheritance

var foo = function() { };
foo.prototype.value = "foo";
foo.prototype.bar = function() {
print(this.value);
};
var baz = function() { };
baz.prototype = new foo; // baz inherits from foo
baz.prototype.value = "baz";
(new foo).bar(); // prints "foo"
(new baz).bar(); // prints "baz"

foo.prototype.betterBar = function() {
print("value: "+ this.value);
};
(new baz).betterBar(); // prints "value: baz"


- Decorator
- Named Parameter
- Currying
Ich weiss mittlerweile was man damit macht, aber auch nach mehrmaligen lesen des Codes aus den Folien, verschliesst sich mir der Sinn.

- Memoization


var fib = function(memo) {
return function(n) {
if (typeof memo[n] !== ‘number’)
memo[n] = fib(n - 1) + fib(n - 2);
return memo[n];
};
}([0, 1]);
fib(24);
fib(8); // no new calculations needed


Als letztes haben wir noch kurz unter dem Titel “Debugging & Analyzing” von ein paar JavaScript Tools gehört.
- Firebug
was wir auch schon lange einsetzen und vollkommen begeistert von sind. Welches ich nicht nur im JavaScript Bereich empfehlen kann, sondern auch für HTML und CSS debugging.
Der Nachteil es gibt es nur für den Firefox.

Alternativen fuer andere Browser wären:
- Firebug lite
- Microsoft Visual Web Developer 2008
- WebDevHelper

Zum Analysieren von JavaScript Code wurde “JavaScript Lint” empfohlen, was ich mir wohl auch mal anschauen sollte.

Da mit JavaScript viele Probleme auf eine sehr eigenartige Art und Weise gelöst werden, kam am Ende auch noch eine kleine Diskussion über die Qualität des JavaScript-Codes auf. Mir hat die Aussage sehr gut gefallen hat, dass auf den ersten Blick viele Sachen die in JavaScript geschrieben sind, der “kryptisch” aussehen. Aber da man bei JavaScript auf andere/ungewöhnliche Mittel angewiesen ist, braucht man auch andere/ungewöhnliche Lösungen.