当前位置： 正文

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

03-20 面试题/算法&算力分析 156
Angular面试题

访谈中有关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面试题1

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="{{url}}" 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面试问题

SQL Server面试问题

来源：

https://www.srcmini02.com/33383.html

微信公众号
手机浏览(小程序)
0
分享到：

猜你喜欢

用php找出字符串中连续重复次数最多的字符，你有方法吗？
面试题/算法&算力分析

05-06 2033
php编写函数取得上一月的最后一天
面试题/算法&算力分析

04-11 1121
php自定义错误处理器
面试题/算法&算力分析

04-11 693
PHP错误级别错误类型
面试题/算法&算力分析

04-11 719
php去掉字段文本的所有html标签
面试题/算法&算力分析

04-11 683
php写出一个正则表达式，过虑网页上的所有JS/VBS脚本（即把script标记及其内容都去掉）
面试题/算法&算力分析

04-11 676
没有账号？ 忘记密码？