脚本宝典收集整理的这篇文章主要介绍了

angular有哪些优缺点?

脚本宝典小编觉得挺不错的,现在分享给大家,也给大家做个参考,希望能帮助你少写一行代码,多一份安全和惬意。

这里是修真院前端小课堂,每篇分享文从

【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】

八个方面深度解析前端知识/技能,本篇分享的是:

【angular有哪些优缺点?  】

目录

1.背景介绍

2.知识剖析

3.常见问题

4.解决方案

5.编码实战

6.扩展思考

7.参考文献

8.更多讨论

 1.背景介绍

  1.1 AngularJS由来?

AngularJS是由Google创建的一种JS框架,使用它可以扩展应用程序中的HTML词汇, 从而在web应用程序中使用HTML声明动态内容。 AngularJS可以让你扩展HTML的语法,以便清晰、简洁地表示应用程序中的组件, 并允许将标准的HTML作为你的模板语言,AngularJS可以通过双向数据绑定自动从拥有JavaScript对 象(模型)的UI(视图)中同步数据。

 2.知识剖析

 

Angularjs-优点

         1.双向数据绑定,数据绑定可能是AngularJS最酷最实用的特性。它能够帮助你避免书写大量的初始代码从而节约开发时间。一个典型的web应用可能包含了80%的代码用来处理,查询和监听DOM。数据绑定是的代码更少,你可以专注于你的应用。

       2.代码模块化,每个模块的代码独立拥有自己的作用域,model,controller等。

       3.强大的directive可以将很多功能封装成HTML的tag,属性或者注释等,这大大美化了HTML的结构,增强了可阅读性。

       4.依赖注入,将这种后端语言的设计模式赋予前端代码,这意味着前端的代码可以提高重用性和灵活性,未来的模式可能将大量操作放在客户端,服务端只提供数据来源和其他客户端无法完成的操作

Angularjs-缺点

       1.验证功能错误信息显示比较薄弱,需要写很多模板标签

       2.从1.0.X升级到1.2.X,貌似有比较大的调整,没有完美兼容低版本,升级之后可能会导致一个兼容性的BUG

       3.ng提倡在控制器里面不要有操作DOM的代码,对于一些jQuery 插件的使用,如果想不破坏代码的整洁性,需要写一些directive去封装插件,但是现在有很多插件的版本已经支持Angular了,如:jQuery File Upload Demo</p>

       4.AngularJS 太笨重了,没有让用户选择一个轻量级的版本,当然1.2.X后,Angular也在做一些更改,比如把route,animate等模块独立出去,让用户自己去选择。

      

 3.常见问题

    Angularjs适用于做什么样的网站 

4.解决方案

1.Web应用页面是非常适合AngularJS使用的,同样不需要SEO,同样可以多方模块化加载,而且经常需要页面上的调整,这样就能够发挥AngularJS的优势了。

2.AngularJS主要考虑的是构建CRUD(增删改查)应用。幸运的是,大多数的WEB应用都是CRUD应用。

5.编码实战

6.扩展思考

  1.angularjs和vue的区别:

    1、vueJS简单易学,而angularJS的上手较高;

    2、vue专注于View层,主打的是快速便捷,而angularJS功能则比较全面,当然体量也较大,相对没有vue那么便捷;

    3、angularJS的指令都是ng-xxx,而vueJS的指令都是v-xxx;

    4、angularJS的所有指令和方法都是绑定在$scope上的,而vueJS是new出来一个实例,

    所有的方法和指令都在这个实例上,一个页面上可以有多个vue实例,但是angularJS的对象只能有一个;

    5、angularJS是由google开发和维护的,vueJS是由个人维护的;

    6、vueJS一般用于移动端的开发,而angularJS一般应用于大型的项目

2.React的优点

1.React伟大之处就在于,提出了Virtual Dom这种新颖的思路,并且这种思路衍生出了React Native,有可能会统一Web/Native开发。在性能方面,由于运用了Virtual Dom技术,Reactjs只在调用setState的时候会更新dom,而且还是先更新Virtual Dom,然后和实际Dom比较,最后再更新实际Dom。这个过程比起Angularjs的bind方式来说,一是更新dom的次数少,二是更新dom的内容少,速度肯定快ReactJS更关注UI的组件化,和数据的单向更新,提出了FLUX架构的新概念,现在React可以直接用Js ES6语法了,然后通过webpack编译成浏览器兼容的ES5,开发效率上有些优势. 

2.React Native生成的App不是运行在WebView上,而是系统原生的UI,React通过jsx生成系统原生的UI,iOS和Android的React UI组件还是比较相似的,大量代码可以复用维护UI的状态,Angular 里面使用的是 $scope,在 React 里面使用的是 this.setState。 而 React 的好处在于,它更简单直观。所有的状态改变都只有唯一一个入口 this.setState(),Angular 就比较复杂,不知道背后使用了哪些黑魔法。同构的JavaScript 

3.单页面JS应用程序的最大缺陷在于对搜索引擎的索引有很大限制。React对此有了解决方案。 

React可以在服务器上预渲染应用再发送到客户端。它可以从预渲染的静态内容中恢复一样的记录到动态应用程序中。 

因为搜索引擎的爬虫程序依赖的是服务端响应而不是JavaScript的执行,预渲染你的应用有助于搜索引擎优化

3.vue优点

Vue.js是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。核心是一个响应的数据绑定系统。

Vue.js的特性如下:1.轻量级的框架2.双向数据绑定3.指令4.插件化

7.参考文献

         参考一:

         

         参考二:

         

8.更多讨论

 1.Vue和React共同点

vue,react 共性: 

 

虚拟dom实现快速渲染 

 

轻量级响应式组件 

 

服务端渲染易于集成路由工具,打包工具及状态管理工具

 

    

 2.SPA vs. MPA

从字面上理解,SPA(单页面应用程序)整个应用只有一个页面,只加载一次Web静态资源,包括HTML+CSS+javascript,在导航过程中不需要重新加载渲染整个页面。而MPA恰恰相反,也就是每个页面都需要独立完整的从后端加载和渲染,早期的网站大多属于MPA。

 

3.框架的模块化和打包

一开始,Web应用还没有这么复杂,JavaScript根本没有模块化的概念,算得上封装的只是function和object,立即执行函数(IIFE)达到了封装私有变量的目的,避免了全局变量受到文件内变量的污染。随着前端应用的发展,命名冲突、依赖复杂导致的问题迫使人们开始考虑模块化的问题。模块系统将互相依赖的多个文件和目录拆分,所有代码都可以按需加载并彼此访问。

最早,伴随着node.js的兴起,CommonJS成功解决了服务器端JS的模块化。但是由于其采用同步加载的方式,加载资源会造成浏览器的“假死”,所以并不适合Web应用的模块化。后来,AMD(异步模块定义)成为浏览器端模块加载的规范,比较流行的库是RequireJS。RequireJS要求模块定义使用define关键字,如下形式:define(['dep'], function(dep){}),模块导入使用require关键字。可见,RequireJS会预先加载依赖,完成后触发回调函数。与RequireJS类似的还有阿里大牛玉伯开发的SeaJS,但模块定义规范不同于AMD,它延续CommonJS规范,称为CMD(公共模块定义)。可惜的是,玉伯承认“现在可以给SeaJS立碑了”。

ES6之后,JavaScript语言本身终于支持模块化了。不需要将所有代码都放在一个IIFE或回调中,只需要在模块中声明需要的内容,所有的声明都被限定在模块的作用域中,对所有脚本和模块全局不可见,然后将需要暴露的模块资源使用export关键字导出,当其它模块依赖此模块时再通过import关键字导入。由于出现较晚,ES6的模块化还不太完善(比如按需加载),浏览器支持也有限,但可以预见,在不远的将来,ES内置的模块化将取代第三方库。

RequireJS/SeaJS可以认为是一种在线“编译”模块的方案,相当于在页面上加载一个AMD/CMD规范解释器。这样浏览器就能解析define,require,exports,module这些关键字,也就实现了模块化。而Browserify/Webpack是预编译模块打包的方案,不需要在浏览器中加载解释器。你在本地直接写JS,不管是AMD/CMD/ES6风格的模块化,它都能编译成浏览器认识的JS。

Webpack已经成为最流行的打包工具,它为所有的静态资源提供单一的依赖树,对JavaScript、CSS等资源进行灵活的操作,并将向浏览器发送内容的数量和次数最小化。其强大之处不仅仅在于它统一了JS的各种模块系统,取代了Browserify、RequireJS、SeaJS的工作,更重要的是它的万能模块加载理念,即所有的资源都可以且也应该模块化。

Parcel是刚刚出世不久的打包或者说是构建工具,是Webpack强有力的对手。相对于配置复杂的Webpack,它号称超级快(速度是Webpack的两倍)、零配置,同时还提供了一个开箱即用的开发服务器,通过热更新来支持快速开发。Parcel也有些不完善的地方,如不支持SourceMap,不能剔除无效代码(TreeShaking)。

总结

以上是脚本宝典为你收集整理的

angular有哪些优缺点?

全部内容,希望文章能够帮你解决

angular有哪些优缺点?

所遇到的程序开发问题,欢迎加入QQ群277859234一起讨论学习。如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典网站推荐给程序员好友。 本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。

80%的人都看过