zoukankan      html  css  js  c++  java
  • angularJS简介及其特点—— 五大特性,加快 Web 应用开发

    AngularJS 是谷歌的一个 JavaScript 框架,旨在简化前端应用程序的开发。

    一. 关于和jquery的比较

    首先angular是一个mvc框架,它与jquery不同之处在于,前者致力于mvc代码解耦,采用model,controller以及view方式去组织代码,而后者提供给你了很多APi函数,你可以不用写很多原生js去实现比较复杂的效果,比如说动画,$.animate,这样的效果如果需要原生js来写的话,代码量将会比较庞大;

    其次,jQuery没有定义你的代码如何组织,你可以将它放在一个单独的js文件中进行引用,也可以直接写在页面中采用script标签进行包裹,甚至可以直接以内联的方式写在html标签中,但是angularjs会将一个HTML页面分成若干个模块,每个模块都可以自己的scope,service以及directive,各个模块之间也可以进行通信,但是整体上结构是比较清晰的,就是说其代码组织方式是模块化的。

    最后,jQuery的思想是先设计好页面,然后在已有页面的基础上进行dom操作后展示页面,但是angular的view可能仅仅是一个框架,对view的dom操作或者时间监听都是在directive中实现的,而且一般情况下很少自己直接去写Dom操作代码,只要你监听model。model发生变化后view也会发生变化。

    二. 关于适用场合

    jQuery应该适用于大多数web开发,移动端也有(jQuerymobile),angularjs有人说更适合做SPA(我个人认为在手机上的SPA可能会引发性能上的问题,因为它的脏检查机制会影响性能),在web端,一些CRUD的应用或者管理类软件还是可以使用的(当然这里的理解可能不一定准确,会随着深入学习更多去了解和使用)。

    三. 关于UI的结合

    开发任何产品都需要用到前端UI,目前很多UI是基于jQuery的,这意味着你如果要用angularjs和这些Ui组件的话,需要用angularjs的directive去重写些组件,这一过程是比较麻烦的,所幸的是,angular给我们提供了一些UI组件可以使用(web端主要是结合bootstrap前端组件),http://angular-ui.github.io/,而在移动端主要是结合ionic框架http://ionicframework.com/,但是随着angular的发展,很多HTML5的前端框架也慢慢集成了angularjs版本可供使用。

    四. angularJS特点

    #1 良好的应用程序结构——代码模块化

      通常情况下,我们编写 JavaScript 没有明确的结构。虽然在编写小应用程序的时候没有问题,但这显然是不适合于大规模的应用程序。使用 AngularJS,您可以通过MVC(模型 - 视图 - 控制器)或MVVM (模型 - 视图 - 视图模型)模式来组织源代码。 AngularJS 是一个 MVW 框架,其中W代表可以用于任何项目。你可以组织你的代码模块,它可显著提高应用程序的可测试性和可维护性。每个模块的代码独立拥有自己的作用域,model,controller等。

    #2 双向数据绑定

      数据绑定肯定是 AngularJS 最佳功能之一。你可以声明绑定的模型到 HTML 元素。当模型Model发生变化时,视图View会自动更新,反之亦然。这可以减少大量的传统样板代码,保持模型和视图同步。

    #3 指令

      AngularJS 指令让你使用 HTML 新语法快速的构建应用程序。您可以创建可重用的自定义组件与指令的API。强大的directive可以将很多功能封装成HTML的tag,属性或者注释等,这大大美化了HTML的结构,增强了可阅读性;例如,如果你想自定义日期选择器小部件,你可以创建一个<data-picker/ >组件。如果你想要一个奇特的文件上传与进度指示器可以继续创建一个<file-upload/ >组件。很酷,不是吗?

    #4 HTML 模板

      AngularJS 使用 HTML 模板,这使事情变得简单,并允许设计人员和开发人员同时工作。设计人员可以按照通常的方式创建用户界面,而开发人员可以使用声明性绑定语法很容易配合不同的UI组件的数据模型。

    #5 可嵌入、注入和测试

      关于 AngularJS 的最好的事情是,它是一个很好的团队成员。它从来没有要求全面承诺。AngularJS 官方网站说,你可以根据你需要使用尽可能多或尽可能少的在项目中使用 AngularJS。如果你只需要双向数据绑定,您可以引入 Angular,只是使用此功能。

      AngularJS 支持依赖注入的开箱即用。如果你需要的东西,你只要调用 Angular 来注入。将这种后端语言的设计模式赋予前端代码,这意味着前端的代码可以提高重用性和灵活性,未来的模式可能将大量操作放在客户端,服务端只提供数据来源和其他客户端无法完成的操作;就这么简单。这巨大的提高可测试性,因为你可以很容易地在测试的模拟组件。

      AngularJS 在创建时候始终考虑着可测试性(测试驱动开发)。这些模块和依赖注入系统,使得单元测试和端对端测试更容易。此外, AngularJS 提供了一个称为量角器工具,这使得终端到终端的测试变得轻而易举。所以,你开发的代码始终是可测试性和可维护性。

    另外推荐参考一篇知乎:http://www.zhihu.com/question/22284218?rf=25116320

      这还不是全部! AngularJS 还提供了更多的实用功能,如路由,过滤器,和动画等等。不过,以上几点已足以让我爱上它。

  • 相关阅读:
    安全编码1
    VPP tips
    VPP概述汇总
    C语言安全编码摘录
    TCP-proxy
    Scipy Lecture Notes学习笔记(一)Getting started with Python for science 1.4. Matplotlib: plotting
    Scipy Lecture Notes学习笔记(一)Getting started with Python for science 1.3. NumPy: creating and manipulating numerical data
    Scipy Lecture Notes学习笔记(一)Getting started with Python for science 1.2. The Python language
    Scipy Lecture Notes学习笔记(一)Getting started with Python for science 1.1. Python scientific computing ecosystem
    25马5跑道,求最快的五匹马的需要比赛的次数
  • 原文地址:https://www.cnblogs.com/SHERO-Vae/p/5737104.html
Copyright © 2011-2022 走看看