AngularJS面试重点：ng-if与ng-show/hide、作用域与数组重复问题解析

"AngularJS常见面试题" 在AngularJS面试中，常常会遇到一系列关于这个框架核心概念和技术的问题。以下是一些常见的AngularJS面试题及其详细解答： 1. 如何衡量一个人的AngularJS水平？ 衡量AngularJS水平通常涉及对以下几个方面理解的深度： - 数据绑定：了解双向数据绑定的基本原理和实现方式。 - 指令：理解ng-if、ng-show/hide、ng-repeat等核心指令的用途和内部工作机制。 - 作用域：知道作用域的层次结构，以及如何避免作用域污染和数据同步问题。 - 服务：熟悉各种内置服务如$http、$q、$rootScope等，以及自定义服务的创建。 - 路由和模块：理解uirouter或ngRoute的配置和使用。 - 过滤器：掌握过滤器的使用，包括自定义过滤器。 - 单元测试：了解使用 Karma 和 Jasmine 进行AngularJS应用的单元测试。 2. ng-if跟ng-show/hide的区别有哪些？ - ng-if会在表达式为真时才创建DOM节点，而ng-show初始时就会创建，通过CSS控制`display:none`和`display:block`来显示或隐藏。 - ng-if会创建新的作用域，而ng-show/hide不会。这可能导致在不同作用域间的数据同步问题。 - 为了避免作用域问题，建议使用对象属性（如data.x）而非基本变量（如x）进行数据绑定。 3. ng-repeat迭代数组时，如果有相同值会怎样？如何解决？ - 当数组中有重复值时，AngularJS会抛出错误`Duplicates in a repeater are not allowed. track by $index`。 - 解决方案是在`ng-repeat`中使用`track by`表达式，如`track by $index`或`track by item.id`，以确保每项都有唯一的标识符。 4. ng-click中能否使用JS原生对象上的方法？ - 在AngularJS中，直接在页面上使用原生JS方法是不行的，因为它们不在当前的Controller作用域中。 - 可以将方法添加到Scope中，或者使用Filter来实现类似功能。例如，可以创建一个名为parseIntFilter的过滤器来处理数字。 5. 使用Filter的好处是什么？ - 过滤器允许在数据展示前进行转换，比如格式化日期、货币或进行简单的计算。 - 过滤器可以独立于控制器，提高代码的复用性和可维护性。 - 它们可以在表达式中轻松嵌入，如`{{value | filterName}}`，使模板更加简洁。 掌握这些关键点是评估AngularJS开发者技能的关键，同时也帮助他们准备面试并解决实际开发中的问题。在实际工作中，深入理解AngularJS的核心概念，以及如何将其与其他前端技术和工具结合使用，是提升个人技术水平的关键。