book

JavaScript Patterns

by Stoyan Stoyan Stefanov Stefanov

May 2012

Intermediate to advanced

240 pages

5h 25m

German

O'Reilly Verlag

Read now

Unlock full access

Zielgruppe dieses BuchesKonventionen in diesem BuchVerwendung der CodebeispieleDanksagungenQuellenLeseempfehlungen
MusterJavaScript: KonzepteObjektorientiertKeine KlassenPrototypenUmgebungECMAScript 5JSLintDie Konsole
Wartbaren Code schreibenWenige globale Variablen verwendenDas Problem mit globalen VariablenNebenwirkungen eines vergessenen varZugriff auf das globale ObjektSingle-var-MusterHoisting: Ein Problem mit verstreuten varsfor-Schleifenfor-in-SchleifenEingebaute Prototypen (nicht) erweiternswitch-MusterImplizite Typecasts vermeideneval() vermeidenZahlen umwandeln mit parseInt()Code-RichtlinienEinrückenGeschweifte KlammernPosition der öffnenden KlammerLeerraumNamenskonventionenKonstruktoren mit Großbuchstaben beginnenWörter trennenAndere Namens-MusterKommentare schreibenEine API-Dokumentation schreibenYUIDoc-BeispielSchreiben, um gelesen zu werdenPeer ReviewsMinifizieren … in der ProduktionsumgebungJSLint nutzenZusammenfassung
Objekt-LiteraleDie Objekt-Literal-SyntaxObjekte aus einem KonstruktorObject-Konstruktor-ÜberraschungEigene Konstruktor-FunktionenRückgabewerte von KonstruktorenMuster zum Erzwingen von newNamenskonventionenthat verwendenSelbst aufrufender KonstruktorArray-LiteralDie Array-Literal-SyntaxKuriositäten im Array-KonstruktorAuf »Array-Haftigkeit« prüfenJSONMit JSON arbeitenRegexp-LiteralRegexp-Literal-SyntaxWrapper für PrimitiveFehler-ObjekteZusammenfassung
HintergrundMehrdeutige TerminologieDeklarationen versus Ausdrücke: Namen und Hoistingname-Eigenschaft von FunctionFunktions-HoistingCallback-MusterEin Callback-BeispielCallbacks und ScopeAsynchrone Event ListenerTimeoutsCallbacks in BibliothekenFunktionen zurückgebenSelbst-definierende FunktionenImmediate FunctionParameter einer Immediate FunctionRückgabewerte aus Immediate FunctionsVorteile und AnwendungsfälleImmediate-Object-InitialisierungVerzweigungen beim Initialisieren (Init-Time Branching)Funktions-Eigenschaften – Ein Memoisierungs-MusterKonfigurations-ObjekteCurryAnwenden einer FunktionPartielle AnwendungCurryingWann man Currying nutztZusammenfassung
Namensraum-MusterNamensraum-FunktionAbhängigkeiten deklarierenPrivate Eigenschaften und MethodenPrivate MemberBevorzugte MethodenPrivacy-LückenObjekt-Literale und PrivacyEigenschaften und PrivacyPrivate Funktionen als öffentliche Methoden bereitstellen (Revelation-Muster)Modul-MusterBereitstellungs-Modul-MusterModule, die Konstruktoren erzeugenGlobale Variablen in ein Modul importierenSandbox-MusterEin globaler KonstruktorModule hinzufügenDen Konstruktor implementierenStatische MemberÖffentliche statische MemberPrivate statische MemberObjekt-KonstantenVerkettungs-MusterVor- und Nachteile des Verkettungs-Mustersmethod()-MethodeZusammenfassung
Klassische versus moderne Vererbungs-MusterErwartete Ergebnisse bei klassischer VererbungKlassisches Muster Nr. 1 – Das Standard-MusterDer Prototypen-Kette folgenNachteile bei Muster Nr. 1Klassisches Muster Nr. 2 – Rent-a-ConstructorDie Prototypen-KetteMehrfachvererbung bei geliehenen KonstruktorenVor- und Nachteile des Geliehener-Konstruktor-MustersKlassisches Muster Nr. 3 – Rent-and-Set-PrototypKlassisches Muster Nr. 4 – Gemeinsamer PrototypKlassisches Muster Nr. 5 – Ein temporärer KonstruktorDie Superklasse speichernDen Konstruktor-Zeiger zurücksetzenKlassPrototypische VererbungDiskussionErgänzung in ECMAScript 5Vererbung durch das Kopieren von EigenschaftenMix-InsMethoden ausleihenBeispiel: Von Array ausleihenAusleihen und BindenFunction.prototype.bind()Zusammenfassung
Singletonnew verwendenInstanz in einer statischen EigenschaftInstanz in einem ClosureFabrik/FactoryEingebaute Object-FabrikIteratorDekorierer/DecoratorAnwendungImplementierungImplementierung mit einer ListeStrategie/StrategyBeispiel: DatenvalidierungFassade/FaçadeStellvertreter/ProxyEin BeispielEin Video-ErweitererOhne StellvertreterHTMLEvent Handlervideos-Objekthttp-ObjektAuftritt des StellvertretersStellvertreter als CacheVermittler/MediatorVermittler-BeispielBeobachter/ObserverBeispiel Nr. 1: Zeitungs-SubskriptionBeispiel Nr. 2: Das Tastatur-SpielZusammenfassung
Separation of ConcernsDOM ScriptingDOM-ZugriffVeränderungen am DOMEventsEvent HandlingEvent DelegationLanglaufende SkriptensetTimeout()Web WorkersRemote ScriptingXMLHttpRequestJSONPJSONP-Beispiel: Tic-Tac-ToeFrames und Image BeaconsJavaScript-Code ausliefernSkripten kombinierenMinifizieren und KomprimierenExpires-HeaderEin CDN verwendenStrategien zum LadenDie Position des <script>-ElementsHTTP ChunkingDynamisches <script>-Element für nicht-blockierende DownloadsDas <script>-Element anfügenLazy-LoadingLoading on DemandJavaScript im Voraus ladenZusammenfassung

Content preview from JavaScript Patterns

Kapitel 1. Einführung

JavaScript ist die Sprache des Web. Sie begann als Möglichkeit, ein paar ausgewählte Elemente einer Webseite anzupassen (wie Bilder und Formular-Felder), ist dann aber immer weiter gewachsen. Neben dem klassischen Browser-Scripting auf Client-Seite lässt sich JavaScript heutzutage auf immer mehr Plattformen nutzen. Sie können Code auf Server-Seite schreiben (mit .NET oder Node.js), Desktop-Anwendungen (unter allen Betriebssystemen) und Anwendungs-Erweiterungen bauen (zum Beispiel für Firefox oder Photoshop), mobile Apps erstellen und Befehlszeilen-Skripte verfassen.

JavaScript ist aber auch eine ungewöhnliche Sprache. Sie besitzt keine Klassen, während Funktionen als First-Class-Objekte für viele Aufgaben genutzt werden. Die ...