Heim > Web-Frontend > js-Tutorial > 50 Angular-Interviewfragen, die Sie beherrschen müssen (Sammlung)

50 Angular-Interviewfragen, die Sie beherrschen müssen (Sammlung)

青灯夜游
Freigeben: 2022-12-28 20:10:55
nach vorne
9781 Leute haben es durchsucht

Dieser Artikel stellt Ihnen 50 AngularInterviewfragen vor, die Sie beherrschen müssen. Er analysiert diese 50 Interviewfragen in drei Teilen: Anfänger, Mittelstufe und Fortgeschrittene, und hilft Ihnen, sie gründlich zu verstehen!

50 Angular-Interviewfragen, die Sie beherrschen müssen (Sammlung)

Wir haben eine Liste der wichtigsten Angular-Interviewfragen zusammengestellt, die in drei Teile unterteilt ist:

  • Angular-Interviewfragen – Anfängerniveau
  • Angular-Interviewfragen – Mittelstufe
  • Angular-Interviewfragen – Fortgeschrittene

【 Verwandte Tutorial-Empfehlungen : „Angular-Tutorial“】

Einsteigerniveau – Interviewfragen

1. Unterscheiden Sie zwischen Angular und AngularJS. M VC Design-Modelle unter Verwendung von Komponenten und Anweisungen

Empfohlene Sprache: TypeScriptAusdruckssyntaxVerwenden Sie () zum Binden von Ereignissen, verwenden Sie [] für die Attributbindung. Bestimmt Mobiler SupportMobiler Support wird bereitgestelltRouting@Route Config {( …) } für die Routenkonfiguration Abhängigkeitsinjektion Unterstützt hierarchische Abhängigkeitsinjektion mit baumbasierter einseitiger Änderungserkennung Struktur Vereinfachte Struktur erleichtert die Entwicklung und Wartung großer Anwendungen Geschwindigkeit Upgrade von Funktionen mehr als bei AngularJS SchnellSupportAktiver Support und häufige neue Updates

2. Was ist Angular?

Angular ist ein Open-Source-Frontend-Webframework. Es ist eines der beliebtesten JavaScript-Frameworks und wird hauptsächlich von Google verwaltet. Es bietet eine Plattform zur einfachen Entwicklung webbasierter Anwendungen und ermöglicht Front-End-Entwicklern die Verwaltung plattformübergreifender Anwendungen. Es integriert leistungsstarke Funktionen wie deklarative Vorlagen, End-to-End-Tools, Abhängigkeitsinjektion und verschiedene andere Best Practices, die den Entwicklungspfad reibungsloser gestalten.

3. Welche Vorteile bietet die Verwendung von Angular?

Nachfolgend sind einige der Hauptvorteile der Verwendung des Angular-Frameworks aufgeführt:

  • Unterstützt die bidirektionale Datenbindung
  • Es folgt der MVC-Musterarchitektur
  • Es unterstützt statische Vorlagen und Angular-Vorlagen
  • Sie können benutzerdefinierte Anweisungen hinzufügen
  • Es unterstützt auch RESTfull-Dienste
  • Unterstützt die Validierung
  • Erleichterte Kommunikation zwischen Client und Server
  • Unterstützt die Abhängigkeitsinjektion
  • Verfügt über leistungsstarke Funktionen wie Event-Handler, Animationen usw.

4. Wofür wird Angular hauptsächlich verwendet?

Angular wird häufig für die Entwicklung von SPAs verwendet, die Single-Page-Anwendungen darstellen. Angular bietet eine Reihe vorgefertigter Module, die die Entwicklung von Single-Page-Anwendungen vereinfachen. Darüber hinaus gilt Angular als ausgereiftes Web-Framework mit integrierten Funktionen für Datenfluss, Typsicherheit und modularer CLI.

5. Was ist ein Winkelausdruck?

Angular-Ausdrücke sind JavaScript-ähnliche Codeausschnitte, die normalerweise in Bindungen wie {{expression}} platziert werden. Diese Ausdrücke werden verwendet, um Anwendungsdaten an HTML zu binden

Syntax: {{expression}}

6. Was sind Vorlagen in Angular?

Vorlagen in Angular werden mit HTML geschrieben, das Angular-spezifische Elemente und Attribute enthält. Diese Vorlagen werden mit Informationen aus dem Modell und dem Controller kombiniert, die weiter gerendert werden, um dem Benutzer dynamische Ansichten bereitzustellen.

7. Was ist String-Interpolation in Angular?

Die String-Interpolation in Angular ist eine spezielle Syntax, die Vorlagenausdrücke in doppelten geschweiften Klammern **{{}} verwendet, um Komponentendaten anzuzeigen. Es wird auch Mustache-Grammatik genannt. **JavaScript-Ausdrücke werden in geschweifte Klammern eingeschlossen, von Angular ausgeführt und die relative Ausgabe wird dann in den HTML-Code eingebettet. Diese Ausdrücke werden normalerweise wie Tabellen als Teil einer Digest-Schleife aktualisiert und registriert.

8. Was ist der Unterschied zwischen Annotation und Decorator in Angular?

Mit der Reflect Metadata-Bibliothek sind Angular-Annotationen der „einzige“ Satz von Metadaten für eine Klasse. Sie werden zum Erstellen von „Annotations“-Arrays verwendet. Dekoratoren hingegen sind Entwurfsmuster, mit denen eine Klasse isoliert dekoriert oder geändert wird, ohne den ursprünglichen Quellcode tatsächlich zu ändern.

9. Wie viel wissen Sie über Controller in Angular?

Controller sind JavaScript-Funktionen, die Daten und Logik für die HTML-Benutzeroberfläche bereitstellen. Wie der Name schon sagt, steuern sie, wie Daten vom Server zur HTML-Benutzeroberfläche fließen.

10. Welchen Umfang hat Angular?

Ein Bereich in Angular ist ein Objekt, das auf das Anwendungsmodell verweist. Es ist der Ausführungskontext des Ausdrucks. Bereiche sind in einer Hierarchie angeordnet, die die Struktur des DOM der Anwendung nachahmt. Bereiche können Ausdrücke überwachen und Ereignisse weitergeben.

11. Was sind Anweisungen in Angular?

Eine Kernfunktion von Angular sind Direktiven, Eigenschaften, die es Ihnen ermöglichen, neue anwendungsspezifische HTML-Syntax zu schreiben. Es handelt sich im Wesentlichen um Funktionen, die ausgeführt werden, wenn der Angular-Compiler sie im DOM findet. Winkelanweisungen sind in drei Teile unterteilt:

  • Komponentenanweisungen

  • Strukturanweisungen

  • Attributanweisungen

12. Was ist Datenbindung?

In Angular ist die Datenbindung eine der leistungsstärksten und wichtigsten Funktionen, mit der Sie die Kommunikation zwischen Ihren Komponenten und dem DOM (Document Object Model) definieren können. Es vereinfacht den Prozess der Definition interaktiver Anwendungen radikal, ohne dass Sie sich um das Pushen und Pullen von Daten zwischen Ansichten oder Vorlagen und Komponenten kümmern müssen. In Angular gibt es vier Formen der Datenbindung:

  • String-Interpolation

  • Eigenschaftsbindung

  • Ereignisbindung

  • Zwei-Wege-Datenbindung

13. In Was ist das? Zweck der Verwendung von Filtern in Angular?

Filter in Angular werden verwendet, um den Wert eines Ausdrucks so zu formatieren, dass er dem Benutzer angezeigt werden kann. Diese Filter können zu Vorlagen, Anweisungen, Controllern oder Diensten hinzugefügt werden. Darüber hinaus können Sie auch Ihre eigenen benutzerdefinierten Filter erstellen. Mit ihnen können Sie Ihre Daten ganz einfach so organisieren, dass sie nur angezeigt werden, wenn bestimmte Bedingungen erfüllt sind. Fügen Sie den Filter zum Ausdruck hinzu, indem Sie das Pipe-Zeichen | gefolgt vom Filter verwenden.

14. Was ist der Unterschied zwischen Angular und jQuery?

Sprache Empfohlene Sprache: JavaScript
Bilder/Eigenschaften und Ereignisse erfordern spezifische NG-Anweisungen
Bietet keinen mobilen Support
$ routeprovider.when() für Routing-Konfiguration
Unterstützt nicht das Konzept der Abhängigkeitsinjektion
Schwer zu verwalten
Mit bidirektionaler Datenbindung werden Entwicklungsaufwand und -zeit reduziert
Kein Support oder neue Updates mehr
Anbieter sind konfigurierbare Dienste in Angular. Dies ist eine Anweisung an das Abhängigkeitsinjektionssystem, die Informationen darüber liefert, wie Abhängigkeitswerte abgerufen werden. Es handelt sich um ein Objekt mit einer e
Funktionen jQuery Angular
DOM-Manipulation ist ist
RESTful API nein ja
Animationsunterstützung ja ja
Deep-Link-Routing Nein Ja
Formularvalidierung Nein Ja
Zwei-Wege-Datenbindung Nein Ja
Was sind Anbieter in Angular? g
t

()-Methode, die aufgerufen wird, um eine neue Instanz des Dienstes zu erstellen. Anbieter können auch andere Methoden und Objekte enthalten, indem sie die Methode get() verwenden, die aufgerufen wird, um eine neue Instanz des Dienstes zu erstellen. Anbieter können auch andere Methoden einbeziehen und die

get()squareMethodeWinkelausdrücke

JavaScript-Ausdrücke

1 Sie können Literale, Operatoren und Variablen enthalten. 1. Sie können Literale, Operatoren und Variablen enthalten.

2. Sie können in HTML-Tags geschrieben werden. 2. Sie können nicht in HTML-Tags geschrieben werden.

3. Sie unterstützen keine Bedingungen, Schleifen und Ausnahmen. 3. Sie unterstützen Bedingungen, Schleifen und Ausnahmen. 4. Sie unterstützen keine Filter.

18. Listen Sie Möglichkeiten zur Kommunikation zwischen Anwendungsmodulen mithilfe der Kernfunktionen von Angular auf. ... Geräte [

$ parent

,

  • c
  • hildHea d , KindKopf**, **chil19. Was ist der Unterschied zwischen service() und Factory()?
  • service() in Angular ist eine Funktion, die in der Geschäftsschicht der Anwendung verwendet wird. Es läuft als Konstruktor und wird einmal zur Laufzeit mit dem Schlüsselwort „new“ aufgerufen. Factory() ist eine Funktion ähnlich wie service(), jedoch leistungsfähiger und flexibler. Factory() ist ein Entwurfsmuster, das beim Erstellen von Objekten hilft.

20. Was ist der Unterschied zwischen $scope und Scope in Angular? $

scope

in Angular wird verwendet, um das Konzept der Dependency Injection (DI) zu implementieren, andererseits wird

scope

für die Direktivenverkettung verwendet.

  • scope is ** Scope ** ist ~ ist
4. Sie unterstützen Filter.
3 Alle Objekte sind in einer Baumstruktur angeordnet und das Dokument kann nur über die bereitgestellte API bearbeitet und aufgerufen werden 3. Alle globalen JavaScript-Objekte, Variablen und Funktionen werden implizit zu Mitgliedern des Fensterobjekts
4. Greifen Sie auf Browserfenster zu und bearbeiten Sie diese Browser hat seine eigene Die Realisierung von

33. Was ist Transpiling in Angular?

Kompilierung in Angular bezieht sich auf den Prozess der Konvertierung von Quellcode von einer Programmiersprache in eine andere. Normalerweise erfolgt diese Konvertierung in Angular von TypeScript nach JavaScript. Dies ist ein impliziter Prozess, der intern abläuft. 34. Wie führe ich eine Animation in Angular aus? als Abhängigkeit innerhalb Ihres Anwendungsmoduls.

35. Was ist in Angular enthalten?

Includes in Angular ermöglichen es Ihnen, die ursprünglichen untergeordneten Elemente einer Direktive an eine bestimmte Position innerhalb einer neuen Vorlage zu verschieben. Die ng-Direktive gibt an, dass der Einfügepunkt des enthaltenen DOM der nächstgelegenen übergeordneten Direktive der enthaltenen Direktive verwendet wird. Attributanweisungen wie

ng-transclude

oder ng-transclude-slot's werden hauptsächlich für die Inklusion verwendet.

36. Was sind Ereignisse in Angular? Ereignisse in Angular sind spezifische Anweisungen, die dabei helfen, das Verhalten verschiedener DOM-Ereignisse anzupassen. Die von Angular unterstützten Ereignisse sind unten aufgeführt:

ng-clickng-copy

ng-cut

ng-dblclick
  • ng-keydown
  • ng-keypress
  • ng-keyup
  • ng-mousedown
  • ng-mouseenter
  • ng-mouseleave
  • ng-mousemove
  • ng-mouseover
  • ng-mouseup
  • ng-blur
  • 37. Einige Tools zum Testen von Angular-Apps auflisten?

KarmaAngular Mocks

  • Mocha

  • Browserify

  • Sion

  • 38. Wie erstelle ich einen Dienst in Angular?
  • In Angular sind Dienste austauschbare Objekte, die mithilfe der Abhängigkeitsinjektion miteinander verbunden sind. Erstellen Sie einen Dienst, indem Sie ihn in einem Modul registrieren, in dem er ausgeführt werden soll. Grundsätzlich können Sie einen Angular-Service auf drei Arten erstellen. Grundsätzlich gibt es drei Möglichkeiten, Dienste in Angular zu erstellen:

FactoryService

Provider

  • 39. Was ist das Singleton-Muster und wo kann man es in Angular finden?
  • Das Singleton-Muster in Angular ist ein großartiges Muster, das die mehrfache Verwendung einer Klasse verhindert. Das Singleton-Muster in Angular wird hauptsächlich in der Abhängigkeitsinjektion und in Diensten implementiert. Wenn Sie also „new Object()“ nicht verwenden, ohne es zu einem Singleton zu machen, werden Ihnen zwei verschiedene Speicherorte für dasselbe Objekt zugewiesen. Wenn Sie das Objekt dagegen als Singleton deklarieren, wird es einfach wiederverwendet, wenn es bereits im Speicher vorhanden ist.

40. Was wissen Sie über REST in Angular?

REST bedeutet

RE

AussehenKleines KontoGroßer ChefGroßartigTransfer (BOT). REST ist ein API-Stil (Application Programming Interface) für HTTP-Anfragen. In diesem Fall gibt die angeforderte URL genau an, welche Daten verarbeitet werden müssen. Die HTTP-Methode identifiziert dann den spezifischen Vorgang, der für die angeforderten Daten ausgeführt werden muss. Daher werden APIs, die diesem Ansatz folgen, als RESTful APIs bezeichnet.

41. Was ist Bootstrapping in Angular? Beim Bootstrapping in Angular geht es lediglich um das Initialisieren oder Starten einer Angular-Anwendung. Angular unterstützt automatisches und manuelles Bootstrapping.

***Autobootstrapper:***Dies geschieht durch Hinzufügen der ng-app-Direktive zum Stammverzeichnis Ihrer Anwendung, normalerweise auf einem Tag oder Markup (wenn Sie möchten, dass Angular Ihre Anwendung automatisch bootet). Wenn Angular die ng-app-Direktive findet, lädt es das damit verbundene Modul und kompiliert dann das DOM. Manuelles Bootstrapping:

Durch manuelles Bootstrapping haben Sie mehr Kontrolle darüber, wie und wann Ihre Angular-Anwendung initialisiert wird. Dies ist nützlich, wenn Sie andere Vorgänge ausführen möchten, bevor Angular aufwacht und die Seite kompiliert.

  • 42. Was ist der Unterschied zwischen Verknüpfen und Kompilieren in Angular?
Die Kompilierungsfunktion wird für die DOM-Manipulation von Vorlagen verwendet und sammelt alle Anweisungen.

Link-Funktion wird verwendet, um DOM-Listener sowie Instanz-DOM-Operationen zu registrieren und nach dem Klonen der Vorlage auszuführen.

    43.
  • Was wissen Sie über Konstanten in Angular?

In Angular sind Konstanten wie Dienste, die zum Definieren globaler Daten verwendet werden. Konstanten werden mit dem Schlüsselwort „constant“ deklariert. Sie werden mithilfe konstanter Abhängigkeiten erstellt und können an einer beliebigen Stelle in einen Controller oder Dienst eingefügt werden. 44. Was ist der Unterschied zwischen Anbietern, Dienstleistungen und Fabriken in Angular?

Providers Services Factory
a Anbieter ist eine Möglichkeit, einen Teil Ihrer Anwendung in app.config A -Dienst zu übergeben, ist eine Möglichkeit, die Methode zum Erstellen zu verwenden Dienste, die mit dem Schlüsselwort „new“ instanziiert werden. Dies ist die Methode zum Erstellen und Konfigurieren des Dienstes. Hier erstellen Sie ein Objekt, fügen ihm Eigenschaften hinzu, geben dann dasselbe Objekt zurück und übergeben die Factory-Methode an den Controller.

45. Was ist Angular Global API?

Angular Global API ist eine Kombination globaler JavaScript-Funktionen, die zur Ausführung verschiedener allgemeiner Aufgaben verwendet werden, wie zum Beispiel:

  • Objekte vergleichen
  • Objekte iterieren
  • Daten transformieren

Es gibt einige gängige Angular Global API-Funktionen wie:

  • **Gehörnt. Kleinbuchstaben: **Konvertieren Sie die Zeichenfolge in eine Zeichenfolge in Kleinbuchstaben.
  • Gehörnt. Großbuchstaben: Wandeln Sie eine Zeichenfolge in Großbuchstaben um.
  • Gehörnt. isString: Gibt true zurück, wenn die aktuelle Referenz ein String ist.
  • **Gehörnt. isNumber: **Gibt „true“ zurück, wenn die aktuelle Referenz eine Zahl ist.

Fortgeschrittenes Niveau – Fragen im Vorstellungsgespräch

46. Beschreiben Sie, wie man in Angular Cookies setzt, abruft und löscht.

Um Cookies mit Angular verwenden zu können, müssen Sie ein Modul namens ngCookies angle-cookies.js einbinden.

Cookies setzen – Um Cookies im Schlüsselwertformat zu setzen, verwenden Sie die Methode „put“.

cookie.set("nameOfCookie","cookieValue");
Nach dem Login kopieren

**Cookies abrufen –**Um Cookies zu erhalten, wird die Methode „get“ verwendet.

cookie.get("nameOfCookie");
Nach dem Login kopieren

**Cookies löschen –** Verwenden Sie die Methode „Löschen“, um Cookies zu löschen.

cookie.delete("nameOfCookie");
Nach dem Login kopieren

47. Wenn Ihr Datenmodell außerhalb des „Bereichs“ aktualisiert wird, erläutern Sie bitte den Vorgang. Wie werden Sie ihn sehen?

Sie können die Ansicht mit einer der folgenden Methoden aktualisieren:

  • ApplicationRef.prototype.tick() : Es wird eine Änderungserkennung für den gesamten Komponentenbaum durchgeführt.

  • **NgZone.prototype.run():** Es führt eine Änderungserkennung für den gesamten Komponentenbaum durch. Hier ruft run() unter der Haube den Tick selbst auf und dann erhalten die Parameter die Funktion vor dem Tick und führen sie aus.

  • **ChangeDetectorRef.prototype.detectChanges():** Es startet die Änderungserkennung für die aktuelle Komponente und ihre Unterkomponenten.

48. Erklären Sie die ng-app-Direktive in Angular.

ng-app-Direktive wird zum Definieren von Angular-Anwendungen verwendet und ermöglicht uns die Verwendung von Auto-Bootstrapping in Angular-Anwendungen. Es stellt das Stammelement einer Angular-Anwendung dar und wird normalerweise in der Nähe des or-Tags deklariert. In einem HTML-Dokument können beliebig viele ng-app-Anweisungen definiert werden, aber nur eine Angular-Anwendung kann offiziell implizit gebootet werden. Die restlichen Anwendungen müssen manuell gestartet werden.

Beispiel

<div ng-app=“myApp” ng-controller=“myCtrl”>
First Name :
<input type=“text” ng-model=“firstName”>
<br />
Last Name :
<input type=“text” ng-model=“lastName”>
<br>
Full Name: {{firstName + ” ” + lastName }}
</div>
Nach dem Login kopieren

49 Wie wird eine eingebettete Ansicht aus einer vorbereiteten TemplateRef eingefügt?

@Component({
    selector: &#39;app-root&#39;,
    template: `
        <ng-template #template let-name=&#39;fromContext&#39;><div>{{name}}</ng-template>
    `
})
export class AppComponent implements AfterViewChecked {
    @ViewChild(&#39;template&#39;, { read: TemplateRef }) _template: TemplateRef<any>;
    constructor() { }

    ngAfterViewChecked() {
        this.vc.createEmbeddedView(this._template, {fromContext: &#39;John&#39;});
    }
}
Nach dem Login kopieren

50. Wie verstecke ich HTML-Elemente, indem ich einfach auf die Eckschaltfläche klicke?

HTML-Elemente können mit Ihrem Controller ganz einfach ausgeblendet werden, indem Sie die ng-hide-Direktive verwenden, um HTML-Elemente beim Klicken auf die Schaltfläche auszublenden.

Ansicht

<div ng-controller ="MyController">
  <button ng-click ="hide()">欢迎关注全栈程序员社区公众号</ button>
  <p ng-hide ="isHide">欢迎关注Java架构师社区公众号!</ p>
</ div>
Nach dem Login kopieren

Controller

controller: function() {
    this.isHide = false;
    this.hide = function(){
        this.isHide = true; 
    }; 
}
Nach dem Login kopieren

Weitere Programmierkenntnisse finden Sie unter: Einführung in die Programmierung! !

Das obige ist der detaillierte Inhalt von50 Angular-Interviewfragen, die Sie beherrschen müssen (Sammlung). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:掘金--Java架构师社区
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