有很多强大的框架,但是如果你不知道最佳实践,它们可能会非常混乱。在这篇文章中,我们将研究Angular JS首先,什么是Angular JS?
Angular JS是一个基于JavaScript的开源web应用程序框架,用于以模块化的方式开发富HTML Web应用程序,并使用MVVM框架 (请快速尝试)。由于它实现了MVVM框架,因此可以帮助您以更少的代码和更大的灵活性开发应用程序。由于Angular JS完全是客户端,它还可以帮助您轻松创建移动或平板电脑应用程序。例如,PS3上的YouTube应用程序是使用Angular JS构建的。
Angular JS提供了许多功能,下面只是一些突出的功能:
- 数据绑定-Angular JS提供了指令,以便将您的HTML (视图) 与您的JavaScript函数 (控制器) 绑定。
- 表单验证-Angular JS提供表单验证,这是任何接受输入的应用程序的基本要求。
- 依赖注入-AngularJS有一个内置的依赖注入子系统,通过使应用程序更容易开发,理解和测试来帮助开发人员。
- 模板– Angular JS提供了一种创建自己的HTML模板的方法,可以是多个局部视图,甚至是单个页面
- 路由与MVC一样,Angular JS也提供了在视图之间切换的路由功能。
一堂历史课…
Angular JS在2009年首次亮相,并且是为了取代Google Web Toolkit而开发的。Angular JS以前的代码名称是 “location-filtration’”。Google的Misko hever和Igor Minar是Angular JS内部开发团队的创始成员。在成功之后,Angular JS得到了Google的正式支持,并成为一个开源框架。Angular JS的1.0版本于2012年发布,版本1.5.5是Angular JS的当前稳定版本 (也称为 “Ice-manipulation”)。
有许多基于JavaScript的框架可用于使用MVC模式创建富客户端应用程序。然而,他们每个人都有自己特殊的方式来利用JavaScript的力量。在这篇文章的其余部分,我们将看看利用Angular JS的最佳方式。
利用你的力量 (如蜘蛛侠)
如果您决定将其用于您的应用程序,以下是Angular JS的一些最佳实践:
1.初始化和表达式-当您开发任何web应用程序时,请始终在HTML的底部加载JavaScript代码,以便加载JavaScript文件时不会妨碍HTML的加载。此外,将复杂的逻辑拆分为可以在特定视图中呈现的控制器中的方法。每个控制器应该只包含该特定业务视图的逻辑。
2.模块化你的Angular代码-当我们开始编写应用程序时,我们倾向于将所有内容都包含在主模块中。这对于一个小应用程序来说很好,但是当涉及到管理一个更复杂的工具的代码时-随着时间的推移,它往往会变得很大-这是一个巨大的痛苦。所以,总是把你的代码分成正确的模块。将您的应用程序功能划分为模块并相应地创建他们的Angular模块。这样,您可以在另一个页面或视图中重用模块。
3.避免DOM操作-大多数的DOM操作将作为Angular JS的开箱即用功能,因此请尽可能使用这些功能。这样做的原因是,角JS有一个机制,确保其所有的各个部分是同步的。现在,如果你操纵DOM,Angular JS会自动触发事件,使应用程序状态一致,这增加了应用程序不必要的开销。如果你仍然需要做DOM操作,总是打算在 $ scope.$ apply (回调) 函数中进行操作。
4.保持业务逻辑在模型中-始终将您的业务逻辑保留在模型中,以便可以在控制器和其他服务之间轻松共享。这样我们就可以轻松地对模型执行单元测试。该模型用于特定于您的应用程序逻辑以及它希望如何交互。控制器只应将您的代码定向到更新模型的方法或服务,并在模型中创建帮助器类来实现该业务逻辑。
5.Angular JS中的验证-Angular JS提供了验证表单的奇妙功能。这是任何接受用户输入的应用程序的主干。大多数情况下,表单验证在单独的部分中编写为:’如果,否则如果 ..’这是一个非常糟糕的做法。在这种方法中,用户必须多次提交表单才能看到一个验证错误。
相比之下,Angular JS提供了一种在用户填写表单时验证表单的方法。当然,几乎所有的验证都是由Angular JS指令提供的,并且易于使用。
6.利用Angular JS单元测试-与其他框架不同,Angular JS提供了一个很好的框架来对模型进行单元测试。大多数时候,开发人员进行手动测试,看看他们的代码是否正常。有时,为了测试一个微小的变化,与开发单元测试相比,手动测试需要更多的时间。Angular JS核心团队开发了几个工具-量角器和业力-为你做你的角JS代码的单元测试。谢谢伙计们!
7.投资于命名约定-开发任何应用程序时,最重要的事情应该是设置一致的命名约定,以便您的代码易于阅读和管理。任何开发人员都应该能够阅读您的代码并在您缺席的情况下对其进行维护。
8.定义你的组件-不要将您的模型,控制器和工厂组件包含在单个文件中。为每个文件创建三个单独的文件,并相应地在每个文件中编写代码。类似这样的myapp.Module.js,myapp.controller.js,myappfactory.js等。
9.范围-这是每个开发人员应该照顾的最重要的功能之一。该范围在控制器中应该始终是只写的,在模板中应该是只读的。不要在作用域中创建属性-使用对象。
现在完全支持角2测试版,看看什么是新的Infragistics点燃UI 16.1!