Ember.js 面试题

2025 年 3 月 29 日 | 阅读 12 分钟
Ember.js Interview Questions

以下是关于 Ember.js 面试题及其答案的列表。

1) 什么是 Ember.js?

Ember.js 是一个基于模型-视图-视图模型 (MVVM) 模式的 JavaScript Web 框架。它是一个开源框架,用于创建可扩展的单页 Web 应用程序。

What is Ember.js

2) Ember.js Web 框架有多受欢迎?

根据一项研究,Ember.JS 的市场份额约为 14.69%。因此,在 Ember.JS 开发领域继续您的职业生涯是一个绝佳的机会。


3) Ember.js 的核心概念是什么?

以下是一些 Ember.js 中使用的概念:

  • Store:这是应用程序中所有记录的中央存储库和缓存。控制器和管理员可以访问它。
  • Models:它指定了一个类,该类定义了属性和行为的数据。
  • Records:它指定了一个模型实例,该实例包含从服务器加载的信息。
  • Adapter:它负责将请求的记录转换为适当的调用。
  • Serializer:它用于将 JSON 数据转换为记录对象。
  • Automatic Caching:它用于缓存。

4) Ember.js 为什么如此受欢迎?

Ember.js 最棒的地方在于它开发的应用程序是浏览器中运行最快的。


5) Ember.js 的作者是谁?

Ember.js 由 Yehuda Katz 开发,并于 2011 年 12 月首次发布。


6) 使用 Ember.js 的主要优点是什么?

  • 它是一个开源框架。因此,它为开发人员提供了无限的自定义权限,以获得所需的输出。
  • Ember.js 在执行任务时不需要服务器请求。
  • 当用户与浏览器互动或单击任何按钮时,DOM 会直接更新。

7) 你对 Ember.js 中的 Model 有什么了解?

Model 是 Ember.js 中一种有益实用的方法。它用于存储 Ember 应用程序中的持久状态。它用于降低任务的复杂性。模板可以得到简单的支持,开发人员可以始终确保所需的必要数据可以显示在 HTML 页面上。这些数据通常是文本形式,并且根据某些因素,其数量可能会受到限制。


8) Ember.js 的特点是什么?

  • 它在开发模型的核心包含 HTML 和 CSS。
  • 它用于开发可重用的 JavaScript Web 应用程序。
  • 它提供实例初始化器。
  • 它可用于管理 URL。

9) Ember.js 中的路由器是什么?

路由器是 Ember.js 的核心功能。它用于将 URL 转换为一系列模板,并表示应用程序的状态。每个 URL 都有一个相应的路由对象,该对象控制用户可以看到的内容。它将当前 URL 与其他用于加载数据、显示模板和设置应用程序状态的路由进行匹配。


10) Ember.js 中有什么不同类型的路由模型?

  • 动态模型 - 它提供了带有动态段的路由。这些段用于从 URL 访问值。
  • 多个模型 - 它用于通过 RSVP.hash 定义多个模型。例如:

11) Ember.js 的主要组件是什么?

以下是 Ember.js 主要组件的列表:

  • 型号
  • 路由器
  • 控制器
  • 视图
  • 组成部分
  • 模板
  • 助手

12) 解释 Ember.js 应用程序的架构结构?

Ember.js 应用程序的架构结构基于 MVC (模型、视图、控制器) 模式。

  • Models:模型定义了应用程序中使用的数据。
  • Controllers:控制器用于修改查询、编辑数据并提供用户交互。
  • Views:视图用于显示数据并捕获用户操作,以便将来可以轻松重复使用。

13) 如何在 Ember.js 中定义一个新类?

在 Ember.js 中,我们可以调用 Ember.Object 上的 extend() 方法来定义一个新的 ember 类。

示例

上面的示例定义了一个带有 say() 方法的新 App.Person 类。

我们还可以通过调用其 extend() 方法来创建任何现有类的子类。如果您想创建 Ember 内置 Ember.View 类的子类,请参阅以下示例。

示例

在定义子类时,您可以覆盖方法,但仍然可以通过调用特殊的 _super() 方法来访问父类的实现。

示例


14) Ember.js 与其他传统 Web 应用程序有什么区别?

由于许多原因,Ember.js 在大多数其他传统 Web 应用程序中更受欢迎。在应用程序逻辑驻留在服务器上时,ember.js 应用程序会在初始页面加载时下载运行所需的所有内容。因此,它使用户在使用应用程序时无需每次都加载新页面。这就是 Ember.js 的 UI 响应迅速的原因。这种架构的优点是您的 Web 应用程序使用与您的原生应用程序相同的 REST API。


15) Ember.js 中的服务是什么?

在 Ember.js 中,服务是一个长期存在的 Ember 对象,可以在应用程序的不同部分使用。以下语法用于创建 Ember.js 服务。

语法

以下是 Ember.js 服务的一些示例列表:

  • 日志记录
  • 用户/会话身份验证
  • 地理定位
  • 第三方 API
  • Web Sockets
  • 服务器发送事件或通知
  • 不适合 ember-data 等的服务器端 API 调用。

Ember CLI 服务生成器用于生成服务。要访问服务,请在初始化器中注入它或使用以下语法:

语法

通过使用此方法,您还可以使用服务访问属性和方法。

使用以下语法定义服务。

语法


16) Ember.js 中控制器执行的最关键任务是什么?

控制器在 Ember.js 中执行的最关键任务是装饰路由返回的模型。在 Ember.js 中,这是由控制器处理的。并非总是需要只有一个控制器执行此任务,但可能需要多个控制器,具体取决于任务本身。除此之外,用户还会执行许多操作,并且监听这些操作也是 Ember.js 中控制器的责任。


17) 哪个 Ember.js 函数实际上是一个布尔函数?

Log Binding 是一个 Ember.js 函数,实际上是一个布尔函数。


18) Ember.js 中的 ember-data 是什么?

在 Ember.js 中,Ember-Data 是一个库,用于从服务器检索记录、存储它们并在浏览器中更新它们。最后,它还将它们保存回服务器。


19) 你对 ember 路由的理解是什么?如何在 Ember.js 中生成路由?

Ember.Route 类用于在 Ember.js 中定义各个路由。一个 ember 路由由三个部分构成:

  • 第一部分是 Ember 路由 (/app/router.js) 中的条目,它在我们的路由名称和特定 URI 之间进行映射。
  • 第二部分是路由处理程序文件,用于设置加载该路由时应该发生什么。
  • 第三部分是路由模板,用于指定在哪里显示页面的实际内容。

在 Ember.js 中,当我们想要创建一个可以通过 URL 访问的新页面时,我们需要使用 Ember CLI 生成一个“路由”。因此,生成器将打印出:

  • 安装路由
  • 创建 app/routes/about.hbs
  • 创建 app/templates/about.hbs
  • 更新路由器
  • 添加路由 about
  • 安装路由测试

如果要定义路由,请运行以下命令:

语法

上面的命令将在 app/routes/ 文件夹中生成一个名为 route-name.js 的文件,在 app/templates/route-name.hbs 中生成该路由的模板,并在 tests/unit/routes/route-name-test.js 中生成一个单元测试文件。它还将路由添加到路由器。


20) Ember.js 中的适配器是什么?为什么要使用它?

在 Ember Data 中,适配器用于确定数据如何持久化到后端数据存储。诸如后端主机、URL 格式和用于与 REST API 通信的标头等内容都可以在适配器中进行配置。例如,rest adapter 用于处理 JSON API,而 LSAdapter 处理本地存储。


21) 在 Ember.js 中定义和插入视图的两种方法是什么?

在 Ember.js 中定义和插入视图有两种方法:

定义和插入视图的第一种方法:

  • 扩展 Em.View 类,并在 JavaScript 中创建一个对象来定义视图。您可以在其中声明您的函数和变量。
  • 在模板中插入视图。现在,按照给定的语法编写 handlebars 脚本 {{ #view App.ViewName}}

定义和插入视图的第二种方法:

  • 在此技术中,您无需在模板中插入视图对象时指定其名称。但在对象内部,应将名为 **templateName** 的另一个属性初始化为与模板中的 handlebar 脚本标签中的 data-template-name 属性值相同。

22) Ember.js 组件指定什么?

Ember.js 组件使用 W3C Web 组件规范,并提供正确的封装 UI 小部件。它包含三个主要规范:模板、Shadow DOM 和自定义元素。

在 data-template-name 中声明的组件具有路径名而不是纯字符串。


23) 你对 Ember.js 结构有什么了解?

Ember.js 遵循模型、视图和控制器结构。它缩写为 MVC。

Model:Model 用于定义存在的数据,这对开发人员很有用。

View:View 用于显示数据,还捕获用户的操作,以便在需要时使用。

Controller:Controller 用于修改查询。它还以最可靠的方式修改数据并提供用户交互。


24) Ember.js 中的 Route 和 Router 有什么区别?

Route 和 Router 在 Ember.js 中都是不同的术语。**Router** 是用于将应用程序连接到浏览器地址的媒介。另一方面,**Route** 是用户请求在由 Router 制作或翻译后首先到达的位置。Route 仅负责定义要发送到 Template 的数据。


25) Ember.js 中哪个函数是布尔函数?

Log Binding 函数是 Ember.js 中的一个布尔函数。


26) Ember.js 中哪个函数用于测试值是否为数组?

isArray 函数用于检查值是否为数组。如果传入的对象是数组或类数组,它将返回 true。如果满足以下任一条件,则对象被视为类数组:

  • 对象是原生 Array
  • 对象具有 objectAt 属性
  • 对象是 Object 并且具有 length 属性

27) Ember.js 中 Router 和 {{outlet}} 标签的用途是什么?

Router 用于指定应用程序的所有可能状态并将其映射到 URL,而 {{outlet}} 标签用于通过提供一种方法让容器模板包含子模板来构建部分层次结构。


28) 适配器在 Ember.js 中的作用是什么?

适配器用于处理与分配给它的任务相关的查询。不同的适配器可以分配不同的任务。它还可以查询后端和前端。Ember.js 中的常见适配器有 Rest、JSON、LS Adapter,后者用于处理本地存储或需要低存储数据的情况。


29) Ember.js 中模板的用途是什么?

在 Ember.js 中,模板用于创建一个或多个页面的布局。当更改模板时,基于该模板的页面会自动更改。


30) Ember.js 中有哪些不同的模板组件?它们之间有相似之处吗?

Ember.js 中有各种强大的模板组件,用于与无错误地运行代码相关的特定目的。

这些模板组件包括:

  • 视图 (View)
  • Outlet
  • Render(呈现)
  • Partial
  • 收益

它们在一个方面相似,即它们可以在所有程序中以相似的功能被调用。


31) Ember.js 包有哪些不同的通用函数?

Ember.js 包的不同通用函数包括:

  • empty - 如果依赖属性的值为 null、空数组、空字符串或空函数,则返回 true。
  • bind - 它提供了一种方便的方法来异步集成第三方库到您的 Ember 应用程序中。
  • isArray - 如果传入的对象是数组或类数组,则返回 true。
  • compare - 它比较两个 JavaScript 值。
  • typeOf - 它为传入的对象返回一个一致的类型。
  • isEqual - 它比较两个对象,如果它们相等则返回 true。

32) 创建 Ember.js 应用程序的步骤是什么?

您需要执行以下步骤来创建一个 ember.js 应用程序:

  • 首先,安装 ember-cli。几乎所有应用程序都是使用 ember-cli 构建的。
  • 使用 ember new 创建新应用程序。它会生成一个新的应用程序。
  • 使用 materialize-CSS 进行样式设计,以实现 Material Design。
  • 使用 ember g component 创建组件。
  • 检查是否存在 router.js 文件。它定义了您所有的路由。
  • 如果您有一个 video 路由,并且想在页面上显示一组 YouTube 视频,那么创建一个简单的 video card 组件,该组件可以迭代并在 video 页面上显示。

33) 解释 Ember.js 中的目录结构。

在 Ember.js 中,项目结构也称为目录结构。它包含以下文件和目录:

I-app:它包含模型、组件、路由、模板和样式的文件夹和文件。

I-bower_components/ bower.json:它是一个依赖管理工具,在 Ember CLI 中用于管理前端插件和组件依赖。

I-config:它包含 environment.js,用于控制应用程序的配置设置。

I-dist:当我们为部署构建应用程序时,它包含创建的输出文件。

I-node_nodules/package.json:目录和文件来自 npm。Npm 是 node.js 的包管理器。

Public:public 目录包含图像和字体等资产。

Vendor:此目录指定了 Bower 未管理的Chào phụng dependencies 的位置。

Tests/testem.js:应用程序的自动化测试位于 test 文件夹中,测试在 testem.js 中配置。

Tmp:Ember CLI 临时文件存储在此处。

Ember-cli-build.js:此文件描述了 Ember CLI 如何构建我们的应用程序。


34) 你对 Ember.js 中的观察者有什么了解?

Ember 支持观察任何属性,包括计算属性。观察者是包含响应其他属性更改的行为的东西。当需要在使用绑定完成同步后执行某些行为时,就会使用观察者。新的 Ember 开发人员经常使用观察者。观察者主要在 ember 框架内使用,为此,计算属性是合适的解决方案。可以使用以下语法在对象上设置观察者:“ember.observer” Ember 中的观察者是同步的。它们在观察到属性更改后立即触发。因此,很容易引入属性尚未同步的 bug。


35) 如何在 Ember.js 中定义视图?


36) Ember inspector 是什么?

Ember inspector 是一个用于调试 Ember 应用程序代码的工具。它提供了一种与 Ember 对象交互并查看其属性的方法。

一些最常问的 Ember.js 选择题

1) 以下哪个命令用于创建 Ember.js 应用程序?

  1. create application.js
  2. ember application
  3. ember new application
  4. 以上都不是
 

答案:C 是正确选项。 "ember new application" 命令用于在 Ember.js 中创建新应用程序。

2) Ember.js 服务有什么用?

  1. Ember.js 服务用于日志记录。
  2. Ember.js 服务用于用户身份验证或会话身份验证。
  3. Ember.js 服务用于提供地理位置。
  4. 以上全部。
 

答案:D 是正确选项。 Ember.js 服务用于满足以上所有选项。

3) 以下哪个命令用于在 Ember.js 中启动开发服务器?

  1. ember serve
  2. ember start
  3. ember begin
  4. ember go
 

答案:A 是正确选项。 "ember serve" 命令用于启动开发服务器。

4) 以下哪个命令用于在 Ember.js 中停止开发服务器?

  1. ember stop
  2. Ctrl-C
  3. Ctrl-B
  4. ember break
 

答案:B 是正确选项。要随时停止开发服务器,您需要在终端中输入 Ctrl-C,开发服务器将被停止。

5) Ember.js 中的控制器做什么?

  1. 控制器可以装饰路由返回的模型。
  2. 控制器可以监听用户执行的操作。
  3. A 和 B 都正确。
  4. 以上都不是。
 

答案:C 是正确选项,因为 A 和 B 选项都正确。

6) Ember.js 中使用了哪些模板组件?

  1. Partial 模板组件
  2. View 模板组件
  3. Render 模板组件
  4. 以上全部。
 

答案:D 是正确选项。