Heim  >  Artikel  >  Web-Frontend  >  Einführung in die erweiterte JavaScript-Programmierung

Einführung in die erweiterte JavaScript-Programmierung

巴扎黑
巴扎黑Original
2017-07-18 17:06:061440Durchsuche


Vorwort:

Ich habe ungefähr eine Woche gebraucht, um die Hälfte dieses Buches sorgfältig zu lesen, siehe unten Ich hoffe, dass die Lesenotizen, die ich gemacht habe, den Leuten, die dieses Buch lesen, eine grobe Referenz geben können. Im Moment ist es möglicherweise etwas chaotisch und nicht vollständig. Ich werde es klären und später hinzufügen. (2017-7-17)

Kapitel 1 JavaScriptEinführung

Kapitel 2HTMLverwendet in HTMLJavaScript

Kapitel 3 Grundkonzepte

3.1.Grammatik

Groß-/Kleinschreibung beachten

Identifikator(Es wird empfohlen, Camel Case zu verwendenmyCar)

Kommentar // /**/

Streng Modus (verwenden Sie streng)

Anweisung empfiehlt var diff-a-b; die Verwendung von Semikolon und if( test ) { Alert (Test); }Verwenden Sie auch {}

3.2 Schlüsselwörter und reservierte Wörter

3.3 Variable

Nicht initialisiertundefiniert var message = „hi“; Der Typ kann nach Belieben geändert werden

Function test(){

Var a = “hi”; 局部

b = “hi”; 全局

}

Test(); Fehler hi

Datentyp

typeof

Undefiniert (

definiert, aber nicht zugewiesen)

Null(

Null-Objektzeiger)

Boolean(

Boolescher Werttrue false Die Flusskontrollanweisung führt automatisch das entsprechende aus boolean Konvertieren)

Zahl

(

Oktal0 Dezimal zehn Hexadezimal0x Gleitkomma-WertebereichNaN Numerische KonvertierungNumber parseInt )

String(

String, kein Unterschied zwischen einfachen und doppelten Anführungszeichen, Escape-Sequenz, String-Eigenschaften, toString String)

Object(

Object Die Basis von Alle Objekte var o = new Object();)

Funktion in ES ist ein Objekt, kein Datentyp.

3.5

Operator

Unärer Operator++ -- , + -( kann zum Konvertieren von Datentypen verwendet werden )

Bitoperatoren Bitweises NICHT~num1 Bitweises UND& Bitweises ODER| Bitweises XOR^ Linksverschiebung<< RechtsverschiebungRechtsverschiebung ohne Vorzeichen >>

Boolescher Operator

! && ||. Multiplikativer Operator* / % Additivoperator+ - Relationaloperator < 🎜>Bedingter Operator? :

Zuweisungsoperator

= *= /= %= += -= <<= >>= >> ;=

Kommaoperator

3.6

Anweisung

3.7

Funktion

Argumente Keine Überladung

Kapitel 4

Variablen, Umfang und Speicherprobleme

4.1

Werte von Basistypen und Referenztypen

Dynamische Attribute (Referenztypen können dynamisch Attribute hinzufügen)

Variablenwerte kopieren

(

Die Grundtypen sind unterschiedlich Space, der Referenztyp bezieht sich auf den gleichen Raum )Übergabeparameter

(

das Gleiche)

Erkennungstyp (Typ der Instanz von)

4.2Ausführungsumgebung und -umfang

Umfangskette Bereichskette erweitern(try-catch with) Kein Bereich auf Blockebene(wenn für Variable Abfrage-ID deklarieren )

4.3Garbage Collection

Strategie(Mark Clear Reference Count ) Leistungsprobleme beim Verwalten des Speichers

Kapitel 5 Referenztypen

5.1 ObjektTyp

Var person = {};(eignet sich zur Übergabe einer großen Anzahl von Parametern an Funktionen) var parson = new Object();

Person[„name“](Wenn Sie Variablen zur Darstellung von Attributen verwenden, verwenden Sie ) person.name(Empfohlen)

5.2 Array Typ

Var farben = new Array(); var farben =[*****];

Colors[*] = *****; Colors.length

Array erkennen: Instanz von Array.isArray()

Konvertierungsmethode: toString() valueOf() toLocaleString() join()

Stack-Methode: push() pop()

Warteschlangenmethode: shift() unshift()

Neuordnungsmethode: reverse() sort(Sie können den Vergleichsfunktionsparameter hinzufügen )

Operationsmethode: concat()Die ursprüngliche Änderung wird hinzugefügt slice()Die ursprüngliche Änderung ist das abgefangene Segment

Positionsmethode:

indexOf() lastIndexOf()

Gibt die Position des Elements zurück

Iteration Methode:

every() filter() forEach() map() some()

Jedes Element wird verarbeitet, aber das ursprüngliche Array ändert sich nicht

Zusammenführungsmethode:

reduce()

Reihenfolge

reduceRight()Umgekehrte Reihenfolge für beide Elemente 5.3 Datum

Typ

Neues Datum()

inside

parse(

"May 25, 2004") UTC(2005,0) Date.now()

Geerbte Methode:

toLocaleString( ) toString() valueOf()

Datumsformatierungsmethode:

toDateString() toTimeString() toLocaleDateString() toLocaleTimeString() toUTCString()

Datum

/

Zeitkomponentenmethode: zu viele spezifische Messwerte

5.4RegExp

Typ

Literal

var pattern1 = / [bc]at / i;

Konstruktor

var pattern2 = new RegExp(“ [bc]at ”, ” i ”);

RegExp

Instanzattribut

globalignoreCase lastIndex multiline source

Es ist nutzlos

RegExpInstanzmethode: exec() Gruppe erfassen(Mehrere Übereinstimmungssätze erfassen) text() Überprüfen Sie, ob es gleichzeitig übereinstimmt

Einschränkungen des Modus: Fehlen erweiterter Funktionen für reguläre Ausdrücke, die von einigen Sprachen unterstützt werden ​​(Perl)

, aber in den meisten Fällen reicht

5.5 Funktion Typ Funktion ist ein Objekt

(

ist auch

Function Instanzen von ), der Funktionsname ist ein Zeiger. function sum(num1,num2) { }

Var sum = function(num1,num2){ };

Es gibt keine Überladung: Die Funktion ist ein Objekt und der Funktionsname ist ein Zeiger.

Funktionsdeklaration und Funktionsausdruck:

Funktion *******

Funktionsdeklarationsförderung

var sum = ** * ****

wird nicht fördern Funktionsinterne Eigenschaften: Argumente

Objekt

(

AttributAufgerufenerzeigt auf Funktion) diesesObjekt(Zeigen Sie auf das Umgebungsobjekt , in dem die Funktion ausgeführt wird) AttributAufrufer (zeigt auf die Funktion, die die aktuelle Funktion aufruft, wenn es sich um eine Funktion mit globalem Gültigkeitsbereich handelt Wert ist null) Funktionsattribute und -methoden:

Attribute

( Länge

Deklarationsparameter Nummer

Prototyp

Geerbt) Nicht vererbte Methode : call( ) apply() bind()

a.apply( b, c );

Führen Sie die Funktion

a im Umgebungsobjekt

b

aus und

übergeben Sie die Parameter an

a übrigens c( Argument oder Array ) / d( jedes Element schreiben out ) Var a = b.bind(c); a

ist im

c

Umgebungsobjekt Ausführungsfunktion

5.6Grundlegender Wrapper-Typ:

Boolean

Typ:

var booleanObject = new Boolean(true);

Es wird empfohlen, niemals

Boolean

-Objekte zu verwenden. Nummer

Typ:

var numberObject = new Number(10); ) toExponential() toPrecision()

Es wird außerdem empfohlen, den Typ Number nicht direkt zu instanziieren.

String Typ:

var stringObject = new String(

„hello world“); length

Attribute

1.Zeichenmethode: charAt() oder string[] gibt das entsprechende Zeichen zurück charCodeAt() Gibt die entsprechende Zeichenkodierung zurück

2. String-Operationsmethode:

concat() oder +-Operator sieht genauso aus wie der concat()

Slice() substring() substr()

Intercept-String, drei sind sehr flexibel

3.

String-Positionsmethode:

indexOf( ) lastIndexOf()

4.trim()

Methode entfernt alle Leerzeichen im Präfix und Suffix

trimLeft() trimRight()

5. String-Case-Konvertierungsmethode

toLowerCase() toUpperCase()

Klassische Methode

toLocaleLowerCase() toLocaleUpperCase()

Bestimmte Regionen Dies ist zuverlässiger

6. String-Muster-Abgleichsmethode

match()

ist im Wesentlichen dasselbe wie

exec() von RegExp, das das mit der Zeichenfolge übereinstimmende Array zurückgibt

search()

Gibt den Index der ersten Übereinstimmung zurück, andernfalls wird

-1

zurückgegeben replase()

Passen Sie die Zeichenfolge an und ersetzen Sie sie

split()

Passen Sie das Trennzeichen an, um ein Array zu generieren

7.localeCompare()

Vergleichen Sie zwei Zeichenfolgen

8.fromCharCode()

Statische Methode Mehrere Zeichen codieren. Werden Sie eine Zeichenfolge

9. HTML

-Methode Zum Beispiel

big() string

5.7

Einzelnes integriertes Objekt

1.Global

Objekt

URL

Kodierungsmethode:

encodeURI()

Das Ganze

encodeURIComponent() einige A-Absatzkodierung

decodeURI()

die gesamte

decodeURIComponent() eine bestimmte Absatzdekodierung

eval()

Methode ist sehr mächtig und sehr gefährlich

ECMAScriptParser

Global

Objekteigenschaften

undefiniert, Array......sind alle Eigenschaften

Web

-Browser implementiert das globale Objekt als Teil des

Fenster-Objekts

2.Math

Objekt

Math

Objekteigenschaften Einige spezielle Werte wie π

min() max( )

Methode

Rundungsmethode: Dezimalwert in Ganzzahl umwandeln

Math.ceil(25) Eins vorwärts Math.floor(25) Eins zurück Math.round(25) Rundung

random() Methode [0,1) Zufallszahl zwischen

Andere Methoden Zu viel lesen

Kapitel 6 Objektorientierte Programmierung

6.1Objekte verstehen

6.1.1Attributtyp:

Datenattribut: 4Attribute

Accessor-Eigenschaft: enthält keinen Datenwert 4 Eigenschaften, die über Object.defineProperty()

6.1.2

Definieren Sie mehrere Eigenschaften: Object.defineProperties() kann ein Datenattribut oder ein Accessor-Attribut sein.

6.1.3

Merkmale zum Lesen von Eigenschaften: Object.getOwnPropertyDescriptor()

6.2

Objekte erstellen

6.2.1

Werksmuster( Lesen )

6.2.2

Konstruktormuster(Lesen neuer Konstruktor)

6.2.3

Prototypmuster:

1. Prototypobjekte verstehen

2.

Prototyp und inBetreiber( in for-in )

3.

Einfachere Prototypensyntax(Objektliteral für den Zugriff auf Objekte)

4.

Dynamisch Art des Prototyps( Der Prototyp kann durch ein anderes Objekt ersetzt werden, ist jedoch für die bereits erstellte Instanz ungültig)

5.

Prototyp eines nativen Objekts( dient zur Verwendung des Prototypmodus. Sie können darin neue Methoden definieren, dies wird jedoch nicht empfohlen)

6. Problem mit Prototypobjekten: Es gibt keine Attribute, die zur Instanz selbst gehören

6.2.4

Verwendung von Konstruktormuster und Prototypmuster in Kombination

Das häufigste Muster: Instanzen haben ihre eigenen Eigenschaften und Methoden, und einige werden gemeinsam genutzt.

6.2.5

Dynamischer Prototypmodus

Fügen Sie eine Beurteilungsaussage zum obigen Muster hinzu, um den Prototyp dynamisch zu ändern. Hinzufügen Verfahren.

6.2.6

Parasit-Konstruktormuster

Der einzige Unterschied zwischen dem Fabrikmuster und dem Fabrikmuster ist einsneu, und es hat mehrere Rückkehr. Das zurückgegebene Objekt hat nichts mit dem Konstruktor zu tun, daher kann der Operator instanceof nicht zur Bestimmung des Objekttyps verwendet werden. Nicht empfohlen.

6.2.7Sicheres Konstruktormuster

ähnelt dem parasitären Konstruktormuster, jedoch ohne die Verwendung von diesem und neu. instanceof kann auch nicht erkannt werden

6.3Inherited

6.3.1Prototyp-Kette Prototyp-Suchmechanismus

1.Vergessen Sie nicht den Standard-Prototyp: den Standard für Alle Funktionen Prototypen sind alle Instanzen von Object.

2.Bestimmen Sie die Beziehung zwischen Prototyp und Instanz: instanceof isPrototypeOf()

3 Methoden definieren: Neue Methoden müssen definiert werden, nachdem die Instanz den Prototyp ersetzt hat.

4. Prototypenkettenproblem:

Attribute außerhalb des Prototyps werden ebenfalls vererbt

Wann Beim Erstellen einer Instanz eines Untertyps können keine Parameter an den Konstruktor des Obertyps übergeben werden.

wird selten allein verwendet.

6.3.2Verwenden Sie den geliehenen Konstruktor, um call oder apply Parameter erben und übergeben, aber nur das Konstruktormuster verwenden.

wird auch selten allein verwendet.

6.3.3

Kombinierte Vererbung

Prototypkettenimplementierung Prototypattribute und Vererbung von Methoden

Ausleihen von Konstruktoren zur Implementierung Vererbung von Instanzeigenschaften

Die am häufigsten verwendete Vererbungsmethode

6.3.4

Prototypische Vererbung(Lesen)

Konstruktor wird nicht verwendet Ein beibehaltener Typ kann verwendet werden, aber er teilt die Eigenschaften des Referenztyps wie das Prototypmuster.

6.3.5

Parasitäre Vererbung(Lesen)

Konstruktor wird nicht berücksichtigt kann verwendet werden Funktionswiederverwendung ist jedoch nicht möglich

6.3.6

Parasitäre kombinatorische Vererbung(Lesen)

Problem mit der Komposition Vererbung: Der Konstruktor des Supertyps wird zweimal aufgerufen, was zu doppelten Eigenschaften in der Instanz und im Prototyp führt.

Parasitäre kombinierte Vererbung löst dieses Problem und wird zum idealsten Vererbungsparadigma.

Kapitel 7 Funktionsausdruck

Definition von Funktionen:

Funktionsdeklaration(Funktionsdeklaration wird mit Name gefördert)

Funktionsausdruck( Name ist eine leere anonyme Funktion/Benannte allgemeine Funktionsausdrücke sind anonyme Funktionen)

7.1Rekursion

Der strenge Modus kann nicht verwendet werden arguments.callee Sie können benannte Funktionsausdrücke verwenden.

7.2Abschluss: Eine Funktion, die Zugriff auf eine Variable im Gültigkeitsbereich einer anderen Funktion hat

Selbstzusammenfassung: Abschlüsse sind Funktionen, im Allgemeinen werden anonyme Funktionen verwendet

1 Abschlüsse können auf Variablen in zurückgegebenen externen Funktionen zugreifen.

2.Das aktive Objekt einer anderen Funktion wird gespeichert, bis die Gültigkeitskette des Abschlusses zerstört wird.

7.2.1Abschlüsse und Variablen

Nebenwirkungen: Abschlüsse werden auf der Scope-Kette gespeichert das gesamte Variablenobjekt, sodass die zurückgegebene Variable der zuletzt gespeicherte Wert ist.

Beispielsweise kommt es in der for-Schleife zu unbefriedigenden Situationen.

7.2.2ÜberdiesesObjekt

Das dieses-Objekt im Abschluss Der Abschluss kann in einigen Sonderfällen auf dem globalen Objekt platziert werden, sodass sich dies automatisch ändert.

7.2.3Speicherverlust

Verwenden Sie Abschlüsse, um ein normales Speicherrecycling sicherzustellen

7.3Umfang auf Blockebene imitieren

Verwenden Sie zur Nachahmung eine anonyme selbstausführende Funktion.

Selbstzusammenfassungsfunktion:

1.Es wird nach der internen Ausführung zerstört.

2.Anonyme selbstausführende Funktionen können die Verschmutzung globaler Methoden und Eigenschaften reduzieren.

Beim Schließen gibt es ein Gedächtnisproblem und die Verwendung dieser Kombination ist sehr komfortabel.

7.4Private Variablen

Alles auf dem Objekt ist öffentlich Alles in der Funktion ist privat

Erstellen Sie die öffentliche Methode der Funktion durch Abschluss(Privilegierte Methode) --------- wird verwendet, um private Variablen zu erhalten

im Konstruktor erstellt                                                                                                                                                                                                                          🎜>this.****** = function(){ **** }; Aber bei jeder Instanziierung wird eine Reihe von Methoden neu erstellt, was verschwenderisch ist.

7.4.1Statische private Variablen                                                     Wenn eine Instanz keine eigenen privaten Eigenschaften hat

statisch verwenden

privater Bereich

globale Konstruktion durch Schließung Erstellen Sie privilegierte Methoden im Prototyp der Funktion.

Verbessert die Wiederverwendbarkeit von Code, aber jede Instanz verfügt nicht über eigene private Variablen. (Weil dies als statische private Variable bezeichnet wird )

Verwenden Sie je nach den spezifischen Anforderungen Instanzvariablen oder statische private Variablen .

7.4.2Modul.                                                                       Literal Ein Instanzobjekt

Privat erstellen Variablen und privilegierte Methoden für einen Singleton

(

Singleton: ein Objekt mit nur einer Instanz

) Definieren Sie darin private Variablen und Methoden die anonyme Funktion und verwenden Sie dann ein Objektliteral als Rückgabewert der Funktion.

7.4.3

Erweiterter Modulmodus

muss eine Instanz eines bestimmten Typs sein , müssen auch einige Eigenschaften oder Methoden hinzugefügt werden.

Das obige ist der detaillierte Inhalt vonEinführung in die erweiterte JavaScript-Programmierung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn