JavaScript-Bibliotheken Ein Vortrag von Johan Gründer und Stefan Hinrichs Hochschule Emden/Leer.
-
Upload
bathilde-schiffer -
Category
Documents
-
view
107 -
download
2
Transcript of JavaScript-Bibliotheken Ein Vortrag von Johan Gründer und Stefan Hinrichs Hochschule Emden/Leer.
JavaScript-BibliothekenEin Vortrag von Johan Gründer und Stefan Hinrichs
Hochschule Emden/Leer
Inhalt des Vortrags
I. JavaScript-Grundlagen
II. Bibliotheken und deren Anwendung, Vor- und Nachteile
JavaScript-Bibliotheken
JavaScript-Bibliotheken
I. Historie und Grundlagen
• Entwicklung im Jahr 1995 durch Brendan Eich, Netscape
• Abkömmling von der Programmiersprache C, nicht mit Java zu verwechseln (!!!)
• Standardisierung unter Namen „ECMAScript“ (ECMA-262)
• Konkurrenzkampf gegen Microsofts „JScript“
• Einführung des Document Object Models (DOM) zur Standardisierung und Vereinheitlichung eines Modells mit Script-Sprache für viele Browser (heute: DOM Level 3)
• Script-Sprache durch eigenen Browser interpretiert (vgl. PHP serverseitige Interpretation)
• Aktuelle Version 1.8.6, Entwicklung: Mozilla
I. Anwendungsgebiete
• dient der Optimierung und Manipulation von HTML-Websites (DOM)
• Implementierung und Überprüfung von Formularen, Suchfunktionen, Navigation, Quickbars u.v.m.
• Implementierung von komplett eigenen Anwendungen (nur browserinterpretiert!)
• kann Buttons, Checkboxes usw. definieren und mit einer Funktion beschreiben
• Funktionen von HTML und CSS können abgenommen werden
• arbeitet clientseitig (vgl. PHP serverseitig)
JavaScript-Bibliotheken
I. Syntax• Beliebiges JavaScript-Dokument reicht zur Erklärung
JavaScript-Bibliotheken
JavaScript-Bibliotheken
II. Was ist eine JavaScript-Bibliothek• „Handbuch“, Frameworks
• erleichtert, verkürzt die Programmierung
• vollständige Problemlösungen gerade bei komplexen Funktionen
• große Nachfrage erfordert Entwicklung leicht zu benutzender Interfaces
JavaScript-Bibliotheken
II. Eine moderne ausgereifte Bibliothek…• browserübergreifende Unterstützung
• alte JavaScript-Objekte müssen weiter funktionieren
• globale Namespace soll so wenig wie möglich verschmutzt werden
• ausführliche, aktuelle „Anleitung“
• Umgang mit DOM erleichtern
• fertige User-Interface-Elemente
• die Bibliothek kann durch eigene Funktionen erweitert werden
JavaScript-Bibliotheken
II. Bibliotheken und deren Anwendung
1. jQuery
2. MooTools
3. Prototype
4. Scriptaculous
5. Dojo
6. YUI
JavaScript-Bibliotheken
jQuery
• freie JavaScript-Bibliothek
• Veröffentlichung: Jan 2006 durch John Resig
• zwei unabhängige Versionsstränge Browserkompatibilität
• September 2008: Microsoft und Nokia kündigen an mit jQuery zu arbeiten
• aktuelle Versionen: 1.10.2 / 2.0.3
JavaScript-Bibliotheken
jQuery - Funktionen• Elementselektion im DOM
• DOM-Manipulation
• erweitertes Event-System
• Hilfsfunktionen
• Animationen und Effekte
• Ajax-Funktionalitäten
• zahlreiche freie Plug-ins
JavaScript-Bibliotheken
Prototype• freie JavaScript-Bibliothek
• Veröffentlichung: 2005 von Sam Stephenson
• war Bestandteil von Ruby on Rails
• heute Grundlage von script.aculo.us
• aktuelle Version: 1.7.1
JavaScript-Bibliotheken
Prototype - Funktionen• Unterstützung klassischer objektorientierter Programmierung
• Programmierhilfen für Ajax
• XMLHttpRequest-Verfahren (asynchrone Verarbeitung)
JavaScript-Bibliotheken
MooTools• Veröffentlichung: 2006 durch Valerio Proietti
• zunächst Effekt-Plugin für Prototype
• dann Entwicklung zum eigenständigen Framework
• meist verwendet von: phpMyAdmin, Chrysler, MTV Germany, Nintendo usw.
• setzt sich aus dem Paketen „Core“ und „More“ zusammen
• aktuelle Version: 1.2.4
JavaScript-Bibliotheken
MooTools - Funktionen• „Core“ und „More“ Komponenten
• Core: Element-Selektoren, einfache Effekte, Ajax-Funktionen
• More: Plugins wie Formular-Validator, Drag&Move, Date-Funktionen etc.
• Objektorientierte Programmierung, Klassenvererbung
JavaScript-Bibliotheken
Scriptaculous• Script.acul0.us , Open-Source-Projekt
• Veröffentlichung: 2005 durch Thomas Fuchs
• stammt aus dem Webtool „fluxiom“
• in Ruby on Rails integriert, kann auch separat verwendet werden
• Add-On zu Prototype Framework (Benutzung von Prototype vorausgesetzt)
• genutzt von: NASA, APPLE, IKEA, Gucci, Shopify, Ruby on Rails
• aktuelle Version: 1.9.0
JavaScript-Bibliotheken
Scriptaculous - Funktionen• Visuelle Effekte (5 Kerneffekte)
• Animation Framework
• Ajax controls
• unit testing
• Controls: GUI-Elemente, Drag&Drop, Autocompletion, in place editing
• Builder: DOM-Elemente können dynamisch erzeugt werden
JavaScript-Bibliotheken
Dojo• freies modulares Framework
• Veröffentlichung: 2004 durch Alex Russell, Dylan Schlemann und David Schontzler
• Dojo-Foundation Ziel: Verbreitung von Tool-Kits
• genutzt von: IBM, Sun Microsystems, AOL etc.
• aus drei Komponenten: Hauptteil: Dojo, 2. Teil: Dijit, 3. Teil: DojoX
JavaScript-Bibliotheken
Dojo - Funktionen• Widgets (Dijit: Menüs, Tabellen, Vektorgrafiken, Online-Editor etc.)
• Asynchrone Kommunikation
• Clientseitige Datenspeicherung
• Serverseitige Datenspeicherung (!)
JavaScript-Bibliotheken
YUI• Yahoo! User Interface Library, Open-Source
• Veröffentlichung: 2005 durch Yahoo!
• vor allem für interaktive Webanwendungen
• im mehreren Komponenten geteilt (zur besseren Übersicht)
JavaScript-Bibliotheken
YUI - Funktionen• Komponenten:
• Core: DOM-Scripting, Events
• Infrastructure: YUI-Basisklassen
• Developer-Tools: Konsole, Unit-Tests
• Utilities: viele Hilfsfunktion (drag&drop, Rich-Text-Editor, Resizer)
• CSS: Arbeit mit den Stylesheets .css , CSS-Reset
• Widgets: unterschiedliche Elemente
JavaScript-Bibliotheken
FAZIT• alle Bibliotheken zum Teil sehr ausgereift
• durchgehende Weiterentwicklung durch Open-Source
• es gibt nicht die „eine“ Bibliothek
• es ist letztendlich vom Nutzen abhängig, womit man programmiert
• es gibt zusammenhängende Bibliotheken, wobei es eine Grundlage gibt, die man erlernen muss
• einige Bibliotheken können ohne JavaScript-Kenntnisse benutzt werden
VIELEN DANK FÜR EURE AUFMERKSAMKEIT!
JavaScript-Bibliotheken
Quellen:• http://www.magjs.de/2012-01/kammergruber/kammergruber.html
http://de.wikipedia.org/wiki/JQuery
• http://www.webmasterpro.de/coding/article/javascript-mootools-grundlagen.html
• http://my.opera.com/sonchen80/blog/2011/12/29/jquery-vorteile
• http://script.aculo.us/
• http://de.wikipedia.org/wiki/Script.aculo.us
• http://de.wikipedia.org/wiki/Dojo_Toolkit
• http://prototypejs.org/
• http://de.wikipedia.org/wiki/Prototype_(Klassenbibliothek)
• http://yuilibrary.com/