Häufig gestellte Fragen und Antworten zu JavaScript-Interviews

Veröffentlicht: 2023-01-13

JavaScript in Ihrem Portfolio zu haben, erhöht die Chancen, eine Rolle als Softwareentwickler zu bekommen. Schauen wir uns dennoch die häufig gestellten Fragen zu JavaScript-Interviews an.

JavaScript ist eine der am häufigsten verwendeten Sprachen in der Webentwicklung. Es wird jetzt verwendet, um fast jede Art von Anwendung zu entwickeln.

Bevor wir uns den Interviewfragen zuwenden, sehen wir uns die Vorteile des Erlernens von JavaScript an.

JavaScript

JavaScript ist eine leichtgewichtige, interpretierte oder just-in-time kompilierte Programmiersprache. Es ist eine der Kernsprachen des World Wide Web. Sie kennen die beiden anderen Kernsprachen von www. Sie suchen besser nach ihnen, wenn Sie dies nicht tun.

JavaScript wird hauptsächlich für das Web erstellt. Aber es ist nicht nur für das Web jetzt. Mit Hilfe von Umgebungen wie Node, Deno usw. können wir es auf fast jeder Plattform ausführen.

Schauen wir uns einige Vorteile davon an.

Vorteile von JavaScript

  1. Einfach loslegen. Sie können es auch ohne Programmierkenntnisse lernen.
  2. Große Community drumherum. Sie erhalten alle Hilfe, die Sie wollen, wenn Sie irgendwo feststecken.
  3. Es gibt viele Bibliotheken/Frameworks, die mit JavaScript erstellt wurden, was dazu beiträgt, Anwendungen schneller zu entwickeln.
  4. Wir können Frontend-, Backend-, Android-, iOS- usw. Anwendungen mit JavaScript entwickeln. Wir können damit fast jede Art von Anwendung erstellen. Aber es ist robuster in der Webentwicklung.

Welche Datentypen gibt es in JavaScript?

Die Datentypen werden verwendet, um verschiedene Arten von Daten zu speichern. Datentypen unterscheiden sich von einer Programmiersprache zur anderen. In JavaScript haben wir 8 Datentypen. Sehen wir sie uns nacheinander an.

  • Anzahl
  • Schnur
  • Boolesch
  • Nicht definiert
  • Null
  • BigInt
  • Symbol
  • Objekt

Alle Datentypen außer Object werden als primitive Werte bezeichnet. Und sie sind unveränderlich.

Was sind die eingebauten Methoden in JavaScript?

Die eingebauten Methoden in JavaScript sind für jeden Datentyp unterschiedlich. Auf diese eingebauten Methoden können wir über den jeweiligen Datentyp zugreifen. Sehen wir uns einige integrierte Methoden für verschiedene Datentypen und Datenstrukturen an.

  1. Anzahl
    • zuFest
    • toString
    • …
  2. Schnur
    • zu Kleinbuchstaben
    • beginnt mit
    • DiagrammAt
    • …
  3. Array
    • Filter
    • Karte
    • für jede
    • …

Es gibt viele eingebaute Methoden für jeden Datentyp. Sie können die Referenzen für alle eingebauten Methoden verschiedener Datentypen und Datenstrukturen überprüfen.

Wie erstelle ich ein Array in JavaScript?

Arrays sind eine der zentralen Datenstrukturen in JavaScript. Arrays können jede Art von Daten enthalten, da JavaScript dynamisch ist. Sehen wir uns an, wie man Arrays in JavaScript erstellt.

Wir können ein Array mit eckigen Klammern [] erstellen. Es ist einfach und schnell, Objekte zu erstellen

 // Empty array const arr = []; // Array with some random values const randomArr = [1, "One", true]; console.log(arr, randomArr);

Wir können ein Array mit dem Array -Konstruktor erstellen. Der Konstruktor wird selten verwendet, um Arrays in allgemeinen Projekten zu erstellen.

 // Empty array const arr = new Array(); // Array with some random values const randomArr = new Array(1, "One", true); console.log(arr, randomArr);

JavaScript-Arrays sind änderbar, dh wir können sie nach dem Erstellen beliebig ändern.

Wie erstelle ich ein Objekt in JavaScript?

Neben dem Array ist das Objekt eine weitere zentrale Datenstruktur in JavaScript. Objekte verwenden die Schlüssel-Wert-Paare speichern. Der Schlüssel muss ein unveränderlicher Wert sein, während der Wert beliebig sein kann. Sehen wir uns an, wie Objekte in JavaScript erstellt werden.

Wir können Objekte mit geschweiften Klammern {} erstellen. Es ist einfach und schnell, Objekte zu erstellen.

 // Empty object const object = {}; // Object with some random values const randomObject = { 1: 2, one: "Two", true: false }; console.log(object, randomObject);

Wir können Objekte mit Object erstellen. Leute verwenden dies selten in allgemeinen Projekten.

 // Empty object const object = new Object(); // Object with some random values const randomObject = new Object(); randomObject[1] = 2; randomObject["one"] = "Two"; randomObject[true] = false; console.log(object, randomObject);

JavaScript-Objekte sind änderbar, dh wir können sie nach der Erstellung ändern, wie Sie im 2. Beispiel sehen.

Wie debuggen Sie JavaScript-Code?

Das Debuggen von Code ist nicht einfach. Und es unterscheidet sich von einer Programmiersprache zur anderen, von einem Projekt zum anderen usw.; Sehen wir uns die allgemeinen Dinge an, die zum Debuggen von JavaScript verwendet werden.

#1. Protokollierung

Wir können die console.log Anweisungen an mehreren Stellen in unserem Code verwenden, um den Fehler zu identifizieren. Der Code stoppt die Ausführung der nächsten Codezeilen, wenn es einen Fehler in der vorherigen Zeile gibt.

Die Protokollierung ist eine der alten Debugging-Methoden, die für kleine Projekte ziemlich effektiv ist. Es ist eine gängige Debugging-Technik für jede Programmiersprache.

#2. Entwicklerwerkzeuge

JavaScript wird hauptsächlich für die Entwicklung von Webanwendungen verwendet. So verfügen mittlerweile fast alle Browser über Entwicklertools, die beim Debuggen des JavaScript-Codes helfen.

Eine der am häufigsten verwendeten Debugging-Methoden ist das Setzen von Breakpoints in den Entwicklertools. Die Haltepunkte stoppen die Ausführung von JavaScript und geben alle Informationen über die Ausführung im Moment aus.

Wir können mehrere Haltepunkte um die Stelle herum setzen, an der wir Fehler erhalten, und sehen, was sie verursacht. Dies ist die effektivste Methode zum Debuggen von JavaScript-Webanwendungen.

#3. IDEs

Wir können die IDEs verwenden, um JavaScript zu debuggen. VS Code unterstützt das Debuggen mit Haltepunkten. Die Debugging-Funktion kann je nach verwendeter IDE unterschiedlich sein. Aber die meisten IDEs haben diese Funktion.

Wie füge ich JavaScript-Code in eine HTML-Datei ein?

Wir können die JavaScript-HTML-Datei mit dem script -Tag hinzufügen. Sie können das Beispiel unten überprüfen.

 <!DOCTYPE html> <html lang="en"> <head> <title>Geekflare</title> </head> <body> <h1>Geekflare</h1> <script> // JavaScript code goes here console.log("This is JavaScript code"); </script> </body> </html>

Was sind Cookies?

Cookies sind Schlüssel-Wert-Paare, die zum Speichern kleiner Informationen verwendet werden. Die Informationen können alles sein. Wir können die Ablaufzeit der Cookies einstellen, die nach ihrer Ablaufzeit gelöscht werden. Diese werden häufig verwendet, um die Informationen der Benutzer zu speichern.

Cookies werden nicht gelöscht, selbst wenn wir die Seite aktualisieren, bis wir sie löschen oder sie ablaufen. Sie können die Cookies jeder Webanwendung/Webseite in jedem Browser überprüfen, indem Sie die Entwicklertools öffnen.

Wie liest man einen Keks?

Wir können das Cookie in JavaScript mit document.cookie lesen. Es werden alle von uns erstellten Cookies zurückgegeben.

 console.log("All cookies", document.cookie);

Es wird eine leere Zeichenfolge zurückgegeben, wenn keine Cookies vorhanden sind.

Wie erstelle und lösche ich ein Cookie?

Wir können die Cookies erstellen, indem wir das Schlüssel-Wert-Paar auf document.cookie setzen. Sehen wir uns ein Beispiel an.

 document.cookie = "one=One;";

In der obigen Syntax ist der one -Cookie-Schlüssel und One sein Wert. Wir können dem Cookie weitere Attribute wie Domain, Pfad, Ablaufdatum usw. hinzufügen. jeder von ihnen sollte durch ein Semikolon (;) getrennt werden. Alle Attribute sind optional.

Sehen wir uns ein Beispiel mit Attributen an.

 document.cookie = "one=One;expires=Jan 31 2023;path=/;";

Im obigen Code haben wir dem Cookie ein Ablaufdatum und einen Pfad hinzugefügt. Wenn das Ablaufdatum nicht angegeben wird, wird das Cookie nach der Sitzung gelöscht. Der Standardpfad ist der Dateipfad. Das Format des Ablaufdatums sollte GMT sein.

Sehen wir uns an, wie Sie mehrere Cookies erstellen.

 document.cookie = "one=One;expires=Jan 31 2023;path=/;"; document.cookie = "two=Two;expires=Jan 31 2023;path=/;"; document.cookie = "three=Three;expires=Jan 31 2023;path=/;";

Die Cookies werden nicht überschrieben, wenn der Schlüssel oder Pfad beim Setzen mehrerer Cookies unterschiedlich ist. Wenn Schlüssel und Pfad gleich sind, wird das vorherige Cookie überschrieben. Sehen Sie sich das folgende Beispiel an, das das zuvor gesetzte Cookie überschreibt.

 document.cookie = "one=One;expires=Jan 31 2023;path=/;"; document.cookie = "one=Two;path=/;";

Wir haben das Ablaufdatum aus dem Cookie entfernt und den Wert geändert.

Verwenden Sie als Ablaufdatum ein Datum in der Zukunft, wenn Sie den Code testen, damit er richtig funktioniert. Wenn Sie das gleiche Datum, den 31. Januar 2023 , auch nach dem 31. Januar 2023 beibehalten, werden keine Cookies erstellt.

Wir haben gesehen, wie Cookies erstellt und aktualisiert werden. Sehen wir uns an, wie Cookies gelöscht werden.

Das Löschen von Cookies ist einfach. Ändern Sie einfach das Ablaufdatum des Cookies auf ein beliebiges vergangenes Datum. Überprüfen Sie das Beispiel unten.

 // Creating cookies document.cookie = "one=One;expires=Jan 31 2023;path=/;"; document.cookie = "two=Two;expires=Jan 31 2023;path=/;"; document.cookie = "three=Three;expires=Jan 31 2023;path=/;"; // Deleting the last cookie document.cookie = "three=Three;expires=Jan 1 2023;path=/;";

Das letzte Cookie finden Sie nicht in den Cookies, da es in der letzten Zeile des Codes gelöscht wird. Das war's für das Min-Cookies-Tutorial.

Was sind die verschiedenen JavaScript-Frameworks?

Es gibt viele JavaScript-Frameworks. React, Vue, Angular usw. für die UI-Entwicklung. Express, Koa, Nest usw. für die serverseitige Entwicklung. NextJS, Gatsby usw. für die Generierung statischer Websites. React Native, Ionic usw. für die Entwicklung mobiler Apps. Wir haben hier einige der JavaScript-Frameworks erwähnt. Sie können weitere Frameworks finden, deren Erforschung viel Zeit in Anspruch nehmen wird. Entdecken Sie, wann Sie sie brauchen.

Schließungen in JavaScript

Ein Abschluss ist eine Funktion, die mit ihrem lexikalischen Gültigkeitsbereich und ihrer übergeordneten lexikalischen Umgebung gebündelt ist. Mit Closures können wir auf die Outer-Scope-Daten zugreifen. Die Closures werden gebildet, wenn die Funktionen erstellt werden.

 function outer() { const a = 1; function inner() { // We can access all the data from the outer function scope here // The data will be available even if we execute this function outside the outer function // as inners' closure formed while creating it console.log("Accessing a inside inner", a); } return inner; } const innerFn = outer(); innerFn();

Closures werden häufig in JavaScript-Anwendungen verwendet. Möglicherweise haben Sie sie schon einmal verwendet, ohne zu bemerken, dass es sich um Verschlüsse handelt. Es gibt noch viel mehr über die Schließungen zu erfahren. Stellen Sie sicher, dass Sie dieses Konzept vollständig gelernt haben.

Heben in JavaScript

Hoisting ist ein Prozess in JavaScript, bei dem die Deklaration von Variablen, Funktionen und Klassen an den Anfang des Gültigkeitsbereichs verschoben wird, bevor der Code ausgeführt wird.

 // Accessing `name` before declaring console.log(name); // Declaring and initializing the `name` var name = "Geekflare";

Wenn Sie den obigen Code ausführen, wird kein Fehler angezeigt. In den meisten Sprachen erhalten Sie jedoch den Fehler. Die Ausgabe ist undefined , da hoisting nur die Deklarationen nach oben verschiebt und sie erst in Zeile 3 initialisiert.

Ändern Sie die var wie folgt in let oder const und führen Sie den Code erneut aus.

 // Accessing `name` before declaring console.log(name); // Declaring and initializing the `name` const name = "Geekflare";

Jetzt erhalten Sie den Referenzfehler, der besagt, dass wir nicht auf die Variable zugreifen können, bevor wir sie initialisiert haben.

 ReferenceError: Cannot access 'name' before initialization

Hier werden also let und const in ES6 eingeführt, auf die vor der Initialisierung nicht zugegriffen werden kann, wie der Fehler andeutet. Dies liegt daran, dass sich die mit let oder const deklarierten Variablen in der Temporal Dead Zone (TDZ) befinden, bis die Zeile initialisiert wird. Wir können nicht auf die Variablen von TDZ zugreifen.

Curry in JavaScript

Currying ist eine Technik, um Funktionen mit vielen Parametern in weniger Parameter mit mehreren Callables umzuwandeln. Damit können wir eine aufrufbare Funktion add(a, b, c, d) in add(a)(b)(c)(d) aufrufbar umwandeln. Sehen wir uns ein Beispiel an, wie es geht.

 function getCurryCallback(callback) { return function (a) { return function (b) { return function (c) { return function (d) { return callback(a, b, c, d); }; }; }; }; } function add(a, b, c, d) { return a + b + c + d; } const curriedAdd = getCurryCallback(add); // Calling the curriedAdd console.log(curriedAdd(1)(2)(3)(4));

Wir können die getCurryCallback Funktion verallgemeinern, die für verschiedene Funktionen verwendet wird, um sie in Currying Callables umzuwandeln. Weitere Einzelheiten dazu finden Sie unter JavaScript Info.

Unterschied zwischen Dokument und Fenster

Das window ist das oberste Objekt im Browser. Es enthält alle Informationen über das Browserfenster, wie Verlauf, Standort, Navigator usw.; es ist weltweit in JavaScript verfügbar. Wir können es ohne Importe direkt in unserem Code verwenden. Wir können auf die Eigenschaften und Methoden des window ohne window.

Das document ist Teil des window . Das gesamte auf der Webseite geladene HTML wird in das Dokumentobjekt konvertiert. Das document-Objekt bezieht sich auf das spezielle HTMLDocument-Element, das wie alle HTML-Elemente andere Eigenschaften und Methoden haben wird.

Das window das Objekt stellt das Browserfenster dar, und document stellt das in diesem Browserfenster geladene HTML-Dokument dar.

Unterschied zwischen clientseitig und serverseitig

Die Clientseite bezieht sich auf den Endbenutzer, der die Anwendung verwendet. Die Serverseite bezieht sich auf den Webserver, auf dem die Anwendung bereitgestellt wird.

In der Frontend-Terminologie können wir Browser auf den Computern der Benutzer als Client-Seite und Cloud-Dienste als Server-Seite bezeichnen.

Unterschied zwischen innerHTML und innerText

Sowohl innerHTML als innerText sind Eigenschaften von HTML-Elementen. Mit diesen Eigenschaften können wir den Inhalt eines HTML-Elements ändern.

Wir können innerHTML dem HTML-String eine Eigenschaft zuweisen, die wie normales HTML gerendert wird. Überprüfen Sie das folgende Beispiel.

 const titleEl = document.getElementById("title"); titleEl.innerHTML = '<span style="color:orange;">Geekflare</span>';

Fügen Sie Ihrem HTML-Code ein Element mit dem ID title hinzu und fügen Sie das obige Skript zur JavaScript-Datei hinzu. Führen Sie den Code aus und sehen Sie sich die Ausgabe an. Sie werden Geekflare in oranger Farbe. Und wenn Sie das Element untersuchen, befindet es sich innerhalb des span -Tags. Das innerHTML nimmt also den HTML-String und rendert ihn als normales HTML.

Der innerText auf der anderen Seite nimmt einen normalen String und gibt ihn so aus, wie er ist. Es wird kein HTML wie innerHTML . Ändern Sie im obigen Code innerHTML in innerText und überprüfen Sie die Ausgabe.

 const titleEl = document.getElementById("title"); titleEl.innerText = '<span style="color:orange;">Geekflare</span>';

Jetzt sehen Sie genau die Zeichenfolge, die wir auf der Webseite bereitgestellt haben.

Unterschied zwischen let und var

Die Schlüsselwörter let und var werden verwendet, um Variablen in JavaScript zu erstellen. Das Schlüsselwort let wird in ES6 eingeführt.

let ist blockbezogen und var ist funktionsbezogen.

 { let a = 2; console.log("Inside block", a); } console.log("Outside block", a);

Führen Sie den obigen Code aus. Sie erhalten einen Fehler in der letzten Zeile, da wir nicht auf let a außerhalb des Blocks zugreifen können, da es blockbezogen ist. Ändern Sie es jetzt in var und führen Sie es erneut aus.

 { var a = 2; console.log("Inside block", a); } console.log("Outside block", a);

Sie erhalten keinen Fehler, da wir auch außerhalb des Blocks auf die a -Variable zugreifen können. Lassen Sie uns nun den Block durch eine Funktion ersetzen.

 function sample() { var a = 2; console.log("Inside function", a); } sample(); console.log("Outside function", a);

Sie erhalten einen Referenzfehler, wenn Sie den obigen Code ausführen, da wir außerhalb der Funktion nicht auf var a it zugreifen können, da es sich um einen Funktionsbereich handelt.

Wir können die Variablen mit dem Schlüsselwort var neu deklarieren, aber wir können die Variablen nicht mit dem Schlüsselwort let neu deklarieren. Sehen wir uns ein Beispiel an.

 var a = "Geekflare"; var a = "Chandan"; console.log(a);
 let a = "Geekflare"; let a = "Chandan"; console.log(a);

Der erste Codeabschnitt löst keinen Fehler aus und der Wert ist a und wird auf den zuletzt zugewiesenen Wert geändert. Der zweite Codeabschnitt löst einen Fehler aus, da wir Variablen nicht mit let neu deklarieren können.

Unterschied zwischen Sitzungsspeicher und lokalem Speicher

Der Sitzungsspeicher und der lokale Speicher werden verwendet, um Informationen auf den Computern der Benutzer zu speichern, auf die ohne Internet zugegriffen werden kann. Wir können die Schlüssel-Wert-Paare sowohl im Sitzungsspeicher als auch im lokalen Speicher speichern. Sowohl Schlüssel als auch Wert werden in Zeichenfolgen konvertiert, wenn Sie einen anderen Datentyp oder eine andere Datenstruktur angeben.

Der Sitzungsspeicher wird gelöscht, nachdem die Sitzung beendet ist (wenn der Browser geschlossen wird). Der Standortspeicher wird erst gelöscht, wenn wir ihn löschen.

Wir können mit sessionStorage bzw. localStorage Objekten auf Sitzungsspeicher und Standortspeicher zugreifen, ihn aktualisieren und löschen.

Was ist NaN in JavaScript?

Die NaN wird als Not-a-Number abgekürzt. Es stellt dar, dass etwas in JavaScript keine legale/gültige Zahl ist. Es gibt einige Fälle, in denen wir NaN als Ausgabe erhalten, z. B. 0/0 , undefined * 2 , 1 + undefined , null * undefined usw.,

Was ist Lexical Scoping?

Der lexikalische Geltungsbereich bezieht sich auf den Zugriff auf die Variablen aus dem Geltungsbereich seiner Eltern. Nehmen wir an, wir haben eine Funktion mit zwei inneren Funktionen. Die innerste Funktion kann auf die Bereichsvariablen ihrer beiden übergeordneten Funktionen zugreifen. Ebenso kann die 2nd-Level-Funktion auf den äußersten Funktionsumfang zugreifen. Sehen wir es uns an einem Beispiel an.

 function outermost() { let a = 1; console.log(a); function middle() { let b = 2; // `a` are accessible here console.log(a, b); function innermost() { let c = 3; // both `a` and `b` are accessible here console.log(a, b, c); } innermost(); } middle(); } outermost();

JavaScript verwendet eine Bereichskette, um die Variable zu finden, wenn wir irgendwo im Code darauf zugreifen. Zuerst wird die Variable im aktuellen Bereich und dann im übergeordneten Bereich bis zum globalen Bereich überprüft.

Was wird als Wert und als Referenz übergeben?

Wertübergabe und Referenzübergabe sind zwei Möglichkeiten, die Argumente an eine Funktion in JavaScript zu übergeben.

Wertübergabe: Es erstellt eine Kopie der Originaldaten und übergibt sie an die Funktion. Wenn wir also Änderungen an der Funktion vorgenommen haben, wirkt sich dies nicht auf die ursprünglichen Daten aus. Überprüfen Sie das folgende Beispiel.

 function sample(a) { // changing the value of `a` a = 5; console.log("Inside function", a); } let a = 3; sample(a); console.log("Outside function", a);

Sie werden sehen, dass der ursprüngliche Wert von a nicht geändert wird, obwohl wir ihn innerhalb der Funktion geändert haben.

Pass by reference: Übergibt die Referenz der Daten an die Funktion. Wenn wir also Änderungen an der Funktion vorgenommen haben, werden dadurch auch die ursprünglichen Daten geändert.

 function sample(arr) { // adding a new value to the array arr.push(3); console.log("Inside function", arr); } let arr = [1, 2]; sample(arr); console.log("Outside function", arr);

Sie werden sehen, dass der ursprüngliche Wert von arr geändert wird, wenn wir ihn innerhalb der Funktion ändern.

Hinweis: Alle primitiven Datentypen werden als Wert übergeben, und nicht-primitive werden als Referenz übergeben.

Was ist Memorieren?

Memoization ist eine Technik, die die berechneten Werte in Caches speichert und sie verwendet, wenn wir sie erneut benötigen, ohne sie erneut zu berechnen. Es beschleunigt die Ausführung des Codes, wenn die Berechnung sehr umfangreich ist. Es gibt einen Speicherkompromiß, der im Vergleich zur Zeit kein großes Problem darstellt.

 const memo = {}; function add(a, b) { const key = `${a}-${b}`; // checking whether we computed the value already or not if (memo[key]) { console.log("Not computing again"); return memo[key]; } // adding the newly computed value to cache // here cache is a simple global object memo[key] = a + b; return memo[key]; } console.log(add(1, 2)); console.log(add(2, 3)); console.log(add(1, 2));

Es ist ein einfaches Beispiel, das das Auswendiglernen demonstriert. Hier ist das Addieren von zwei Zahlen keine schwere Rechenaufgabe. Es ist nur für die Demo.

Was ist der Ruheparameter?

Der rest-Parameter wird verwendet, um alle verbleibenden Parameter in einer Funktion zu sammeln. Nehmen wir an, wir haben eine Funktion, die mindestens 2 Argumente akzeptiert und maximal eine beliebige Anzahl von Parametern akzeptieren kann. Da wir nicht die maximale Anzahl an Argumenten haben, können wir die ersten 2 Parameter mit normalen Variablen und alle anderen mit dem Rest-Parameter mit dem Rest-Operator sammeln.

 function sample(a, b, ...rest) { console.log("Rest parameter", rest); } sample(1, 2, 3, 4, 5);

Der rest - Parameter ist ein Array der letzten drei Argumente im obigen Beispiel. Damit können wir beliebig viele Parameter für eine Funktion haben.

Eine Funktion kann nur einen Ruheparameter haben. Und der rest-Parameter sollte der letzte in der Reihenfolge der Parameter sein.

Was ist Objektdestrukturierung?

Die Objektdestrukturierung wird verwendet, um auf die Variablen des Objekts zuzugreifen und sie Variablen mit denselben Namen wie Objektschlüssel zuzuweisen. Sehen wir uns ein Beispiel an.

 const object = { a: 1, b: 2, c: 3 }; // Object destructuring const { a, b, c } = object; // Now, a, b, c will be used as normal variables console.log(a, b, c);

Wir können die Variablen von destrukturierten Variablen in derselben Zeile wie folgt ändern.

 const object = { a: 1, b: 2, c: 3 }; // Changing the names of `a` and `b` const { a: changedA, b: changedB, c } = object; // Now, changedA, changedB, c will be used as normal variables console.log(changedA, changedB, c);

Was ist Array-Destrukturierung?

Die Array-Destrukturierung wird verwendet, um auf die Variablen aus dem Array zuzugreifen und sie Variablen zuzuweisen. Sehen wir uns ein Beispiel an.

 const array = [1, 2, 3]; // Array destructuring // It's based on the index of the array const [a, b, c] = array; // Now, we can use a, b, c as normal variables console.log(a, b, c);

Was sind Event Capturing und Event Bubbling?

Event Capturing und Event Bubbling sind zwei Möglichkeiten der Ereignisweitergabe in HTML DOM. Nehmen wir an, es gibt zwei HTML-Elemente, eines in einem anderen. Und am inneren Element tritt ein Ereignis auf. Nun entscheidet der Ereignisausbreitungsmodus über die Reihenfolge der Ausführung dieser Ereignisse.

Event-Bubbling: Es führt zuerst den Event-Handler für das Element aus, dann für sein Element und dann bis zum obersten Element. Dies ist das Standardverhalten aller Ereignisse.

Ereigniserfassung: Wir müssen für den Fall angeben, dass wir diese Art der Ereignisweitergabe verwenden müssen. Wir können es beim Hinzufügen des Ereignis-Listeners angeben. Die Ereignisse werden in der folgenden Reihenfolge ausgeführt, wenn die Ereigniserfassung aktiviert ist.

  1. Die Ereignisse beginnen mit der Ausführung vom obersten Element bis zum Zielelement nach unten.
  2. Das Ereignis auf dem Zielelement wird erneut ausgeführt.
  3. Die Sprudelereignisausbreitung findet erneut statt, bis das oberste Element oben ist.

Wir können die Ereignisweitergabe stoppen, indem event.stopPropogation eine Methode im Ereignishandler aufrufen.

Was sind die Versprechen in JavaScript?

Das Promise the-Objekt wird für die asynchronen Operationen verwendet, die in Zukunft mit einem Erfolgs- oder Fehlerstatus abgeschlossen werden.

Ein Promise kann sich in einem der folgenden Zustände befinden.

  1. pending – wenn der Vorgang noch im Gange ist.
  2. fulfilled – wenn die Operation erfolgreich abgeschlossen wurde. Wir werden Ergebnisse (falls vorhanden) im Erfolgszustand haben.
  3. rejected – wenn die Operation mit einem Fehler abgeschlossen wurde. Wir werden den Grund (Fehler) haben, warum es fehlgeschlagen ist.

Sehen wir uns zwei Beispiele für Erfolgs- und Fehlerfälle an.

 // Promise which will complete successfully const successPromise = new Promise((resolve, reject) => { setTimeout(() => { resolve({ message: "Completed successfully" }); }, 300); }); successPromise .then((data) => { console.log(data); }) .catch((error) => { console.log(error); }); // Promise which will complete with failure state const failurePromise = new Promise((resolve, reject) => { setTimeout(() => { reject(new Error("Failing the promise for testing")); }, 300); }); failurePromise .then((data) => { console.log(data); }) .catch((error) => { console.log(error); });

Sie können mehr als eine haben und then bei Bedarf verketten. Die zuvor zurückgesendeten Daten werden beim nächsten then -Callback übernommen.

Erklären Sie die verschiedenen Arten von Gültigkeitsbereichen in JavaScript

Es gibt zwei Arten von Bereichen in JavaScript. Der globale Geltungsbereich und der lokale Geltungsbereich .

Möglicherweise haben Sie auch vom Funktionsumfang und Blockumfang gehört. Sie sind lokale Geltungsbereiche für var bzw. let , const .

Was sind selbstaufrufende Funktionen?

Die selbstaufrufenden Funktionen sind namenlose Funktionen, die unmittelbar nach der Erstellung ausgeführt werden. Sehen wir uns einige Beispiele an.

 // Without any parameters (function sayHello() { console.log("Hello, World!"); })(); // With parameters (function add(a, b) { console.log("Sum", a + b); })(1, 2);

Wir können die Argumente sogar an die selbstaufrufenden Funktionen übergeben, wie Sie im Beispiel gesehen haben.

Was sind Pfeilfunktionen?

Die Pfeilfunktion ist syntaktischer Zucker zur normalen Funktion mit einigen Änderungen. Sie verhalten sich in allgemeinen Anwendungsfällen wie normale Funktionen. Pfeilfunktionen sind praktisch, wenn Rückrufe erforderlich sind. Sehen wir uns seine Syntax an.

 // arrow functions will return by default if it doesn't have any brackets let add = (a, b) => a + b; console.log(add(1, 2));

Es gibt einige Unterschiede zwischen den Pfeilfunktionen und normalen Funktionen.

  • Pfeilfunktionen haben keine eigene this -Bindung. Das Schlüsselwort this innerhalb der Pfeilfunktion bezieht sich auf den übergeordneten Gültigkeitsbereich this .
  • Pfeilfunktionen können nicht als Konstruktorfunktionen verwendet werden

Was sind Rückrufe?

Ein Callback ist eine Funktion, die an eine andere Funktion übergeben wird, die innerhalb dieser Funktion aufgerufen wird. Die Verwendung von Rückrufen ist in JavaScript üblich. Sehen wir uns ein Beispiel an.

 function sample(a, b, callback) { const result = a + b; callback(result); } function finished(result) { console.log("Finished with", result); } sample(1, 2, finished);

Die Funktion finished wird als Callback an das sample übergeben. Die finished Funktion wird mit dem Ergebnis aufgerufen, nachdem eine Aktion ausgeführt wurde. Sie werden die Verwendung von Rückrufen hauptsächlich in asynchronen Vorgängen wie Promises, setTimeout usw. sehen.

Welche Arten von Fehlern gibt es?

Lassen Sie uns einige Fehler in JavaScript überprüfen.

ReferenceError : Dieser Fehler tritt auf, wenn die Variable, auf die wir zugreifen, verfügbar ist.

TypeError: JavaScript löst diesen Fehler aus, wenn der Fehler nicht mit anderen Fehlertypen übereinstimmt. Es tritt auch auf, wenn wir versuchen, eine Aktion auszuführen, die mit den Daten nicht kompatibel ist.

SyntaxError: Dieser Fehler tritt auf, wenn die JavaScript-Syntax nicht korrekt ist.

Es gibt auch einige andere Arten von Fehlern. Dies sind jedoch die häufigsten Fehlertypen in JavaScript.

Was sind die verschiedenen Gültigkeitsbereiche von Variablen in JavaScript?

Es gibt zwei Bereiche von Variablen in JavaScript. Die mit dem Schlüsselwort var deklarierten Variablen haben den Funktionsbereich und die mit let und const deklarierten Variablen den Blockbereich .

Weitere Einzelheiten zum Geltungsbereich dieser Variablen finden Sie in der 17. Frage.

Was sind Escape-Zeichen in JavaScript?

Der Backslash ist das Fluchtzeichen in JavaScript. Es wird verwendet, um einige Sonderzeichen zu drucken, die wir im Allgemeinen nicht drucken können. Nehmen wir an, wir möchten apostrophe (') in eine Zeichenfolge drucken, was normalerweise nicht möglich ist, da die Zeichenfolge mit dem zweiten Apostroph endet. In diesem Fall verwenden wir das Escape-Zeichen, um zu vermeiden, dass die Zeichenfolge an dieser Stelle endet.

 const message = 'Hi, I\'m Geekflare'; console.log(message);

Wir können die obige Ausgabe ohne die Verwendung von Escape-Zeichen erreichen, indem wir die äußeren einfachen Apostrophe durch doppelte Apostrophe ersetzen. Aber es ist nur ein Beispiel für die Verwendung eines Escape-Zeichens. Es gibt andere Zeichen, für die wir unbedingt Escape-Zeichen wie \n , \t , \\ usw. benötigen.

Was sind BOM und DOM?

Browser-Objektmodell (BOM): Alle Browser haben ein BOM, das das aktuelle Browserfenster darstellt. Es enthält unser oberstes Fensterobjekt, das zum Manipulieren des Browserfensters verwendet wird.

Document Object Model (DOM): Browser erstellen das DOM, wenn das HTML in die Baumstruktur geladen wird. Wir können die HTML-Elemente mit der DOM-API manipulieren.

Was ist ein Bildschirmobjekt?

Das Bildschirmobjekt ist eine der Eigenschaften des globalen Fensterobjekts. Es enthält verschiedene Eigenschaften des Bildschirms, auf dem das aktuelle Browserfenster gerendert wird. Einige der Eigenschaften sind width , height , orientation , pixelDepth usw.

Fazit

Zu allen oben genannten Fragen kann es Folgefragen geben. Sie müssen also die Konzepte rund um alle oben genannten Fragen vorbereiten.

Sie können auch einige häufig gestellte Fragen und Antworten zu Java-Interviews untersuchen.

Glückliches Lernen