文档章节

angular.js,backbone.js,ember.js区别

造化玉碟
 造化玉碟
发布于 2014/04/05 09:26
字数 1071
阅读 1984
收藏 23

1 backbone. 

    对于初学者来说,我非常建议首先学习backbone 而不是jQuery. 因为jQuery提供的功能是操作DOM和Ajax数据传输. 而Backbone的功能和目的仅仅是提供一个javascript的MVC 实际针对Web就是 MVR. (Model, View, Router路由). 对于初学者有一个良好的代码结构,而不是一上来就用jQuery频繁操作DOM,导致代码很难维护.

    backbone功能仅限于此. backbone 提供了Model层处理前端数据模型, Router提供了前端页面路由(目前大多数都是后端提供页面路由,所以可以不用). View提供了页面视图的模块化和作用域.(完美解决了jQuery一个页面多次出现同一个组件通过id或class操作dom而导致无法分别哪个组件问题). View也自带自己的模板引擎.

    backbone没有提供任何额外的功能. 例如操作dom还是用jQuery, 数据传输也是基于jQuery的ajax通过Model封装了rest.

    backbone还依赖一个非常好用的库 underscore.js 这个库封装了大部分js对象,数组操作, 例如循环,遍历,map, filter对象某个属性, 删除某个属性等等. 很方便,所以backbone其实也是一个库,而不是框架

2 Angular

     目前在项目中完整大规模使用. Angular官方定位 HTML enhanced for web apps(增强目前web app) 和 AngularJS — Superheroic JavaScript MVW Framework (英雄般的MV 无论什么结构层次都支持的框架)

angular 目前的发展节奏就是 大而全, 就是你有我有全都有. 使用angular后,你不需要任何依赖其他库. angular都会有,现在没有以后也会加入.

angular 功能包括
2.1 数据绑定 就是MVVM 结构, 目的就是让开发者完全忘记操作DOM, 只需要操作数据,html页面就会自动更新
例如 var shownumber = 1, 那么你把shownumber = 2 时, 界面就自动更新了, 完全不需要用jQuery用.html()或.text()更新数据. 就这个绑定功能,目前大部分网站的js代码都能删掉 三分之二.

2.2 模块系统, angular 有自己的模块系统, 不需要在用require js 或其他模块系统. 目前第三方模块已经很多http://ngmodules.org/

2.3 数据传输 内置$http,取代了jQuery的$.ajax 而且内置promise,非常好用. 同时有官方做的$resource 模块 支持restful 接口

2.4 操作Dom 内置了一个简化版本的类似jQuery的angular.element, 完全可以不用$ jQuery. 同时提供大量内置的ng- 开头的指令系统通过在html模板中 声明式绑定 解决操作DOM问题. (声明式指令简直就是对不懂js的前端开发的福音,再也不用js的.show(),.hide()了, 直接写到html标签上)

2.5 页面路由系统

2.6 内置一套非常好用结合html5的表单验证系统

2.7 内置ng-指令开头的事件系统 例如ng-click等

2.8 内置非常贴心的过滤器系统, 例如你先把时间写成2012.01.01 只要用 data | xxxx-xx-xx ,或 货币符号把人民币改成美元 {{amount | currency:"USD$"}} ,真贴心.

2.9 集成数组对象操作方法, 看来underscore.js也不需要了. angular.xxx 开头的方法一大堆. (目前我还是用underscore)

2.10 动画效果, angular1.2版本后分为独立的模块 ng-animate 非常方法,只要在html写上样式名字动画自动就出来了,完全不用操心js代码

2.11 操作cookie的模板

2.12 移动端事件模块

2.13 html 标签过滤器, 防止非法字符什么的.

还有很多, angular定位就是大而全. 其实也能感觉到"框架" 与 "库" 的区别

3 Ember

     定位是框架, 原来是苹果公司的内部项目.
ember提供了MVC结构 和 backbone 非常像.
但ember的view集成了数据绑定功能. 使用handlebar 作为模板引擎, (angular模板是DOM模板 和 backbone,ember都不一样)
Ember 还集成路由, 各种贴心易用的属性操作方法, restful ajax.
但Ember 对比angular 还是没有那么多功能

© 著作权归作者所有

造化玉碟
粉丝 44
博文 45
码字总数 26950
作品 0
海淀
前端工程师
私信 提问
加载中

评论(2)

造化玉碟
造化玉碟 博主

引用来自“thREam”的评论

看了楼主的名字我想是否把名字改成道金玉盘比较好些

哈哈,原始的道金玉盘,只能是体,却不再用,后来碎了后,得者都成了圣,才能成就大道成就造化。

thREam
thREam
看了楼主的名字我想是否把名字改成道金玉盘比较好些
《AngularJS学习整理》系列分享专栏

《AngularJS学习整理》系列分享专栏 《AngularJS学习整理》已整理成PDF文档,点击可直接下载至本地查阅 https://www.webfalse.com/read/201748.html 文章 教你用AngularJS框架一行JS代码实现...

开元中国2015
2018/11/09
179
0
AngularJS 、Backbone.js 和 Ember.js 的比较

1 介绍 我们准备在这篇文章中比较三款流行于Web的“模型-视图-*”框架:AngularJS、Backbone和Ember。为你的项目选择正确的框架能够对你及时交付项目的能力和在以后维护你自己代码的能力产生...

oschina
2014/08/23
21.9K
40
JavaScript 开发者的 10 款必备工具

JavaScript,一种所有主流浏览器都支持的语言,是开发基于浏览器的 Web 应用程序的主力,几乎每年都会受到来自众多开发人员的关注。自然地,框架和库的生态系统自然而然地围绕着 JavaScript...

oschina
2017/10/19
2.7K
0
OSChina 技术专题之 AngularJS 更新版(201412)

Angular JS (Angular.JS) 是一组用来开发Web页面的框架、模板以及数据绑定和丰富UI组件。它支持整个开发进程,提供web应用的架构,无需进行手工DOM操作。 AngularJS很小,只有60K,兼容主流浏...

OSC编辑部
2014/10/17
11.2K
26
AngularJS 和 Polymer 的角色,是否有竞争关系

AngularJS 2.0 一个关键的特性就是支持 Web Components。而 Google 的 Polymer 就是一个 Web Component 技术的实现,同时也是一个基于 Web Components 的框架。那么 AngularJS 和 Polymer 之...

oschina
2014/07/26
9.5K
18

没有更多内容

加载失败,请刷新页面

加载更多

搭建高可用MongoDB集群(分片)

搭建高可用MongoDB集群(分片) MongoDB基础请参考:https://blog.51cto.com/kaliarch/2044423 MongoDB(replica set)请参考:https://blog.51cto.com/kaliarch/2044618 一、概述 1.1 背景 ......

linjin200
25分钟前
5
0
CDH6.0.1集成tez-0.9.1计算引擎

参考文章: https://www.jianshu.com/p/9fb9f32e1f0f https://www.baidu.com/link?url=OgpwasnZi7H1dySN2T111sseEWDBaCCTC3DFV61G7756YbrkJCA8Y3UFaueyqnfN&wd=&eqid=daeb8b3500049cf3000000......

Sheav
27分钟前
4
0
Vue内置指令的使用

v-model(数据绑定) v-model常用于表单数据的双向绑定,它本质上是一个语法糖。它主要的有两种应用: 在文本框、多行文本、input的下拉框、单选按钮、复选框中的应用 <div id="app"> ...

凌兮洛
27分钟前
5
0
外部来源应用检查-烦死了,终于找到解决设置了

Android 连接usb调试应用的时候: 华为关闭方法:1、设置-安全-更多安全设置,关掉外部来源应用检查。2、设置-系统-开发人员选项-关闭“监控ADB安装应用” 不知道OPPO 怎么关闭的?...

QGlaunch
28分钟前
4
0
6个K8s日志系统建设中的典型问题,你遇到过几个?

作者 | 元乙 阿里云日志服务数据采集客户端负责人,目前采集客户端 logtail 在集团百万规模部署,每天采集上万应用数 PB 数据,经历多次双 11、双 12 考验。 导读:随着 K8s 不断更新迭代,使...

阿里云官方博客
30分钟前
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部