Heim > Web-Frontend > js-Tutorial > Hauptteil

Einige grundlegende Fragen zu JS

jacklove
Freigeben: 2018-05-21 10:21:12
Original
1496 Leute haben es durchsucht

Beim Entwickeln und Lernen stoßen wir häufig auf einige JS-Probleme. In diesem Artikel werden einige verwandte JS-Grundprobleme vorgestellt.

In welcher Reihenfolge werden CSS und JS auf der Webseite platziert?

Im Allgemeinen fügen wir das CSS in den Head-Tag und den JS-Code am Ende des Body-Codes ein.

<!DOCTYPE html><html><head>
  <meta charset="utf-8">
  <title>JS基础</title>
  <style>
    
    /* 这里放css代码 */      
    
  </style></head><body>
  <!-- 这里放HTML代码 -->
    
  <script>
Nach dem Login kopieren




Erläuterung des weißen Bildschirms und des FOUC

Weißer Bildschirm: Wenn Sie den CSS-Stil unten platzieren, wird die Seite in einigen Szenarien (Öffnen eines neuen Fensters, Aktualisieren usw.) mit einem weißen Bildschirm anstelle des Inhalts angezeigt Wenn Sie das @ Import-Tag verwenden, kann es zu einem weißen Bildschirm kommen, auch wenn der CSS-Link in der Kopfzeile platziert ist.

Das Skript blockiert die Anzeige nachfolgender Inhalte

Das Skript blockiert den Download nachfolgender Komponenten
Bilder und CSS werden gleichzeitig geladen (z. B. Laden von zwei unter einem). Domänenname gleichzeitig) Datei), aber beim Laden von JS ist die Parallelität deaktiviert und das Herunterladen anderer Inhalte wird verhindert, sodass das Platzieren von JS oben auf der Seite ebenfalls zu einem weißen Bildschirm führt.

FOUC (Flash of Unstyled Content) Unstyled Content Flash: Wenn Sie den CSS-Stil unten platzieren, für IE-Browser, in einigen Szenarien (klicken Sie auf den Link, geben Sie die URL ein, verwenden Sie das Lesezeichen zur Eingabe, usw.), es wird das FOUC-Phänomen auftreten (der nicht formatierte Inhalt wird nach und nach geladen und die Seite zeigt plötzlich den Stil an, nachdem das CSS geladen wurde. Bei Firefox tritt das FOUC-Phänomen immer auf).

Welche Funktionen haben Async und Defer? Was ist der Unterschied?

Ohne Async und Defer wird das aktuelle Skript sofort geladen und ausgeführt, und der Browser wird daran gehindert, die Dokumentelemente unter dem Skript-Tag darzustellen Asynchron und verzögert kann der Browser den Prozess des Ladens und Renderns nachfolgender Dokumente parallel zum Laden und Ausführen von JS-Skripten durchführen, dh das Laden erfolgt asynchron.

Der Unterschied zwischen den beiden besteht hauptsächlich darin, wann das Skript nach dem Herunterladen ausgeführt werden soll. Durch die Verzögerung wird die Ausführung des Skripts entsprechend der Ladereihenfolge verzögert, während asynchron keine Rolle spielt Die Reihenfolge Ihrer Erklärung, solange sie sofort geladen wird, nicht in der Reihenfolge.
Im Allgemeinen entspricht die Verzögerung eher unseren Nutzungsszenarien.

Rendering-Mechanismus der Webseite

Parst HTML-Tags, erstellt einen DOM-Baum

Parst CSS-Tags, erstellt einen CSSOM-Baum

Kombiniert DOM und CSSOM in einem Rendering Baum (Renderbaum) führt ein grundlegendes Layout durch

Berechnen Sie die geometrische Struktur jedes Knotens

Zeichnen Sie jeden Knoten auf den Bildschirm und präsentieren Sie ihn dem Benutzer

JavaScript definiert mehrere Datentypen ? Welche sind einfache Typen? Was sind komplexe Typen? : Boolescher Wert, wahr oder falsch (wahr, falsch)

Zahl: Zahlentyp.

String: String-Typ, dargestellt durch einfache Anführungszeichen oder doppelte Anführungszeichen.

Objekt: Objekt, das Kernkonzept von JS, der wichtigste Datentyp. (Alles ist ein Objekt)

Die ersten 5 Typen sind einfache Typen und Object ist ein komplexer Typ.

Was bedeuten NaN, undefiniert und null?

NaN: Es bedeutet keine Zahl, was bedeutet, dass es keine Zahl ist und keinem Wert entspricht, auch nicht sich selbst. Eins ist keinem Wert gleich.

unterdefiniert: Es ist der einzige Wert von Unterdefiniert, was bedeutet, dass die Variable nur deklariert, aber nicht initialisiert wird, was bedeutet, dass es diesen Zeiger gibt, aber Dieser Zeiger zeigt auf kein Leerzeichen

null: Null Der einzige Wert stellt einen Nullzeiger dar, der nicht existiert

Was sind die Funktionen und Unterschiede zwischen typeof und instanceof?

Die Funktion von typeof kann den Datentyp eines zurückgegebenen Werts ermitteln und in die Operation einfügen. Vor der Zahl kann der Operand einen beliebigen Typ haben.

function a(){}

a(){}typeof a"function" //Der Operand ist die Funktion, die functiontypeof 123421"number"typeof "32423423423""string"typeof true"boolean" zurückgibt typeof undefiniert"undefiniert" //Verwenden Sie dies, um undefinierte Variablen zu überprüfen. typeof window"object" //Alle anderen geben ein Objekt zurück

instanceof wird verwendet, um zu bestimmen, ob eine Variable eine Instanz eines Objekts ist, da typeof Begegnungen mit Null, Array und Objekt geben alle den Objekttyp zurück. Wenn wir also feststellen möchten, ob ein Objekt ein Array ist oder ob eine Variable eine Instanz eines Objekts ist, müssen wir uns für die Verwendung von „instanceof“ entscheiden >Codeproblem

1. Der folgende Code bestimmt, ob eine Variable eine Zahl, eine Zeichenfolge, ein Boolescher Wert oder eine Funktion ist

function isNumber(el){ 
 if ((typeof el)==="Number"){   return true;
   }  else { 
return false
  };
}function isString(el){ 
  if ((typeof el)==="String"){   return true;
   }  else { 
return false
  };
}function isBoolean(el){ if ((typeof el)==="Boolean"){   return true;
   }  else { 
return false
  };
}function isFunction(el){  if ((typeof el)==="Function"){   return true;
   }  else { 
return false
  };
}var a = 2, 
b = "jirengu", 
c = false;alert( isNumber(a) ); //truealert( isString(a) ); //falsealert( isString(b) ); //truealert( isBoolean(c) ); //truealert( isFunction(a)); //falsealert( isFunction( isNumber ) ); //true
Nach dem Login kopieren

2. Das Ausgabeergebnis des folgenden Codes ist?

Ich bin ein Bild

3. Die Ausgabe des folgenden Codes ist?

Einige grundlegende Fragen zu JSvar a = 1;

a+++a;typeof a+2 ;

Das Ergebnis ist Zahl2 (Typ von hat eine sehr hohe Priorität, daher wird Typ von a zuerst berechnet und das Ergebnis ist Zahl, und 2 ist enthalten , also Nummer2)

4. Durchlaufen Sie das Array und geben Sie das Quadrat jedes Elements im Array aus

var arr = [3,4,5]// todo. .// Ausgabe 9, 16, 25

Der Code lautet wie folgt:


Ich bin ein Bild

5. Durchlaufen Sie JSON und drucken Sie die darin enthaltenen Werte aus

var obj = { name: 'hunger', sex: 'male', age: 28}//todo ...// Ausgabename: hunger, sex: male, age:28

Der Code ist wie im Bild gezeigt: (Referenz hier)

Einige grundlegende Fragen zu JS

Ich bin ein Bild

6 die Ausgabe des folgenden Codes? Warum

console.log(a);var a = 1;console.log(a);console.log(b);

Die first console.log(a ); Die Ausgabe ist unterdefiniert, da JS globale Variablen heraufstufen wird und a nur deklariert, aber nicht zugewiesen wird.
Die Ausgabe des zweiten console.log(a); ist 1, da es a nach var a =1; zuweist.
Die dritte Ausgabe von console.log(b); meldet einen Fehler, da b kein Wert deklariert oder zugewiesen ist.

In diesem Artikel werden einige grundlegende Einführungsthemen vorgestellt. Wenn Sie weitere relevante Kenntnisse wünschen, schauen Sie sich bitte die chinesische PHP-Website an.

Verwandte Empfehlungen:

So modularisieren Sie require.js mit Front-End-js

Ein mit CSS implementiertes Bild Abgeschlossen Schaltflächeninstanz

Relevante Kenntnisse über AJAX ASP/PHP-Anfrageinstanz

Das obige ist der detaillierte Inhalt vonEinige grundlegende Fragen zu JS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!