别错过哦！Angular面试题和答案汇总 _Angular7

文章图片
访谈中有关Angular开发人员Angular色的最常见问题列表。在这里, 我们将介绍所有Angular版本的问题。例如, AngularJS, Angular 2, Angular 4, Angular 6, Angular 7和最新版本Angular 8。
1)什么是AngularJS？
AngularJS是一个JavaScript框架, 已使用< script> 标签添加到HTML中。它是用JavaScript编写的。它用于通过指令扩展HTML属性, 并使用表达式将数据绑定到HTML。 Angular JS于2010年10月20日由Google首次发布, 并获得了MIT的许可。
了解有关AngularJS的更多信息。
2)AngularJS最重要的功能是什么？
AngularJS最重要的功能是：

模型
视图
控制者
指令
范围
服务
数据绑定
筛选器
可测

3)什么是Angular？
Angular是Google开发和维护的基于TypeScript的开源Web应用程序框架。它是用TypeScript语言编写的。 Angular提供了一种创建响应式单页应用程序的简单, 便捷和强大的方法。这是对AngularJS的完全重写。
了解有关AngularJS的更多信息。
4)Angular有哪些不同版本？
AngularJS是Angular的第一个版本, 也称为Angular1。它于2010年10月20日发布。在该版本之后, Google开发了较新版本的AngularJS, 该版本完全重写了以前的版本。这就是所谓的Angular2。此后, 释放了Angular 4, Angular 6, Angular 7和Angular 8。 Angular 8是其当前版本。
Angular版本：

AngularJS
Angular2
Angular4
Angular6
Angular7
Angular8

5)AngularJS和Angular有什么区别？
Angular JS和Angular之间的主要区别是：

AngularJS	Angular
Angular是Angular版本超过2+的通用名称
Angular用TypeScript编写, 后来被编译为JavaScript。
Angular是基于TypeScript的开源全栈Web应用程序框架。
Angular使用组件的层次结构作为其主要的体系结构特征, 而不是范围和控制器。
Angular使用不同的表达式语法。它使用” []” 进行属性绑定, 使用” ()” 进行事件绑定。
微软TypeScript语言的Angular使用, 它提供了基于类的面向对象的编程, 静态键入, 泛型等, 这些都是服务器端编程语言的功能。
Angular支持页面的动态加载。

6)什么是MEAN堆栈开发？
MEAN堆栈是用于开发Web应用程序的基于JavaScript的技术的集合。 MEAN代表MongoDB, ExpressJS, AngularJS和Node.js。它提供基于客户端和服务器的技术以及数据库, 这就是为什么它也称为全栈开发的原因。在这里, Angular用于客户端, Node.js是服务器端JavaScript执行环境, MongoDB是应用程序中使用的数据库。
7)什么是单页应用程序(SPA)？
单页应用程序是Web应用程序或网站, 它可以像台式机应用程序一样为用户提供非常快速和被动的体验。它仅重新加载当前页面, 而不是整个应用程序, 这就是它非常快的原因。
8)Angular中的指令是什么？
在Angular中, 指令是当Angular编译器在Angular DOM中找到指令时执行的函数。指令指定了如何在Angular应用程序中控制组件和业务逻辑。
指令主要有三种：

组件指令
结构指令
属性指令

了解有关AngularJS的更多信息。
9)Angular中的ng-content指令是什么？
ng-content指令是Angular的功能, 可帮助我们制造可重用的组件。
例如：在传统的HTML中, 标记用于编写内容。即< p> 这是一个段落< / p> 。现在, 请参见以下在Angular标签之间包含自定义文本的示例：
< app-work> 直到你使用ng-content指令< / app-work> , 它才能像HTML一样工作
这将与HTML元素不同。为了使其像上面的HTML示例一样工作, 我们需要使用ng-content指令。
10)Angular中有哪些组件？
组件是Angular的关键功能。它们是Angular应用程序的主要构建块。Angular组件使你的复杂应用程序成为可重用的部分, 你可以非常轻松地重用它们。
你可以使用Angular CLI轻松创建组件。
语法

ng generate component component_name Or ng g c component_name

了解有关Angular组件的更多信息：了解更多
11)什么是Angular中的数据绑定？
在Angular中, 数据绑定是模型和视图组件之间的数据自动同步。双向数据绑定是Angular非常流行和强大的功能, 它在Angular应用程序的视图和业务逻辑之间建立了桥梁。
12)什么是Angular CLI？
Angular CLI是Angular的命令行界面。它有助于你创建应用程序和不同的组件。
安装Angular CLI：
要安装最新版本的Angular CLI, 请运行以下npm命令。

npm install @angular/cli@latest

要创建一个应用程序：
ng new命令用于在Angular中创建新的应用程序。
语法

ng new application_name

要创建组件路线, 服务和管道：
ng generate命令用于在应用程序中创建新的组件, 路由, 服务和管道。
语法

ng new component_name

要测试你的应用在本地运行：
ng serve命令用于在开发过程中本地测试你的应用程序。
语法

ng serve

13)绘制Angular Architecture的示意图。

文章图片
Angular Architecture的基本构建块

模块：每个Angular应用程序都有一个称为AppModule的根模块。它提供了启动机制来启动应用程序。
组件：每个应用程序都有至少一个称为根组件的组件, 该组件将组件层次结构与页面文档对象模型(DOM)连接起来。
指令：指令提供程序逻辑和构建标记以连接到你的数据和DOM。
数据绑定(属性绑定+事件绑定)：事件绑定和属性绑定都用于在Angular应用中提供双向数据绑定。
服务：将为与特定视图无关的数据或逻辑创建服务类, 并且你希望在组件之间共享。
依赖项注入：依赖项注入用于保持复合类的精简和高效。
路由：Angular路由用于定义不同应用程序状态之间的导航路径, 并查看应用程序中的层次结构。

14)什么是Angular中的元数据？
在Angular中, 组件和服务只是带有装饰器的类, 这些装饰器标记了它们的类型并提供了告诉Angular如何使用它们的元数据。因此, 元数据用于装饰类以配置该类的预期行为。
15)什么是Angular中的编译？ Angular中使用什么类型的编译？
Angular应用程序是用TypeScript和HTML编写的。它们的组件和模板必须由Angular编译器转换为可执行的JavaScript。 Angular中有两种编译类型：
即时(JIT)编译：这是一种标准的开发方法, 可在应用程序加载时在运行时在浏览器中编译我们的Typescript和html文件。它很棒, 但也有缺点。由于浏览器内的编译步骤, 视图需要更长的渲染时间。应用程序的大小会增加, 因为它包含不需要的Angular编译器和其他库代码。
提前(AOT)编译：使用AOT, 编译器在构建时运行, 浏览器仅下载应用程序的预编译版本。浏览器加载可执行代码, 因此它可以立即呈现应用程序, 而无需等待首先编译应用程序。该编译比JIT更好, 因为它具有快速呈现, 较小的应用程序大小, 安全性和更早地检测模板错误的优点。
16)Angular和React有什么区别？
Angular和React都与JavaScript相关, 但是它们之间有很多区别。查看Angular和React之间的主要区别：

Angular是一个JavaScript框架, 而React是一个JavaScript库。
Angular用TypeScript编写, 而React用JavaScript编写。
Angular由Google开发和维护, 而React由Facebook开发和维护。
Angular的第一个版本是AngularJS, 于2010年发布, 而React的第一个版本于2013年发布。
Angular是一个完整的MVC(模型, 视图和控制器)框架, 而React是一个简单的JavaScript库。它只是View模型。
Angular使用常规的DOM来更新HTML标签的整个树结构, 这就是为什么它比Angular相对慢的原因, 而React使用虚拟的DOM使其变得惊人的快。这是React的最大特色。
Angular提供双向数据绑定, 而React提供单向数据绑定。
Angular易于扩展, 而React比Angular更可扩展。
与旧技术相比, Angular速度更快, 但React比Angular更快。

进一步了解Angular vs React：了解更多
17)什么是AngularJS表达式？
AngularJS表达式写在双括号{{expressions}}或指令中：ng-bind =” expression” 。 AngularJS表达式就像JavaScript表达式一样, 可以包含文字, 运算符和变量。例如{{5 + 5}}或{{firstName +” ” + lastName}}
范例：

< !DOCTYPE html> < html> < script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"> < /script> < body> < div ng-app> < p> My first expression: {{ 5 + 5 }}< /p> < /div> < /body> < /html>

18)Angular表达式和JavaScript表达式之间的主要区别是什么？
Angular表达式类似于JavaScript表达式, 但是它们之间存在区别, 因为Angular表达式是根据范围对象评估的, 而JavaScript表达式是针对全局窗口对象评估的。
19)Angular中的服务是什么？
在Angular中, 服务用于为各种模块提供通用功能。通过允许你从组件中提取常用功能, 服务可以为你的应用程序提供更好的模块化。
让我们看看如何创建可在多个组件之间使用的服务。在这里, 服务名称是EgService。
范例：

import { Injectable } from '@angular/core'; import { Http } from '@angular/http'; @Injectable({ // The Injectable decorator is required for dependency injection to work // providedIn option registers the service with a specific NgModule providedIn: 'root', // This declares the service with the root app (AppModule) }) export class EgService{ constructor(private http: Http){ } fetchAll(){ return this.http.get('https://xyz.c.om'); } }

上面的服务使用Http服务作为依赖项。
20)什么是Angular中的依赖项注入(DI)？
依赖注入(DI)是重要的应用程序设计模式。在DI中, 一个类要求从外部来源获取依赖关系, 而不是自己创建它们。 Angular有自己的依赖性注入框架来解决依赖性。因此, 你的服务依赖于整个应用程序中的其他服务。
21)Angular中ngFor指令的用途是什么？
模板中使用Angular ngFor指令来显示列表中的每个项目。例如, 在这里我们遍历用户列表,

< li *ngFor="let user of users"> {{ user }} < /li>

ngFor双引号指令中的用户变量是模板输入变量。
22)ngIf指令的用途是什么？
当你仅想在特定情况下显示视图或视图的一部分时, 使用Angular ngIf指令。 Angular ngIf指令用于根据true / false条件插入或删除元素。
让我们举一个例子来显示一条消息, 如果用户年龄小于18岁,

< p *ngIf="user.age > 18"> You are not eligible for this movie ticket!< /p>

注意：Angular不会显示和隐藏消息。它正在从DOM中添加和删除段落元素。这样可以提高性能, 尤其是在具有许多数据绑定的大型项目中。 23)Angular中的插值是什么？
Angular是属性绑定的便捷替代方法。 Angular转换为属性绑定是一种特殊的语法。内插用双花括号({{}})表示。花括号之间的文本通常是组件属性的名称。 Angular用相应组件属性的字符串值替换该名称。让我们举个例子

< h3> {{title}} < img src="http://img.readke.com/220506/11105T550-3.jpg" style="height:30px"> < /h3>

在上面的示例中, Angular评估title和url属性并填充空白, 首先显示粗体的应用程序标题, 然后显示URL。
24)Angular中的模板表达式是什么？
模板表达式的值类似于任何JavaScript表达式。 Angular执行该表达式并将其分配给绑定目标的属性。目标可能是HTML元素, 组件或指令。在属性绑定中, 与[property] =” expression” 一样, 模板表达式在=符号右侧的引号中显示。在插值语法中, 模板表达式用双花括号包围。例如, 在下面的插值中, 模板表达式为{{username}},

< h3> {{username}}, welcome to Angular< /h3>

模板表达式中禁止使用以下JavaScript表达式。

assignments (=, +=, -=, ...) new chaining expressions with ; or , increment and decrement operators (++ and --)

工作/人力资源面试问题

jQuery面试问题

Java OOP面试问题

JSP面试问题

休眠面试问题

SQL面试题

Android面试题

MySQL面试问题

AngularJS是Angular1.0第一版的通用名称。
AngularJS用JavaScript编写。
AngularJS是基于JavaScript的开源前端Web框架。
AngularJS使用范围或控制器的概念。
AngularJS具有简单的语法, 并且与源位置一起在HTML页面上使用。
AngularJS是一个简单的JavaScript文件, 可与HTML页面一起使用, 不支持服务器端编程语言的功能。
AngularJS不支持页面的动态加载。
面试技巧
JavaScript面试问题
Java基础面试问题
Servlet面试问题
春季面试问题
PL / SQL面试问题
Oracle面试问题
【别错过哦！Angular面试题和答案汇总】SQL Server面试问题