angular中依赖注入的原理 nwjs angular技术方案的优点?

[更新]
·
·
分类:互联网
3667 阅读

nwjs

nwjs angular技术方案的优点?

angular技术方案的优点?

优点:
1.模板功能强大丰富,并且是声明式的,自带了丰富的Angular指令。
2.是一个比较完善的前端MVVM框架,包含模板,数据双向绑定,路由,模块化,服务,过滤器,依赖注入等所有功能。
3.自定义Directive,比jQuery插件还灵活,但是需要深入了解Directive的一些特性,简单的封装容易,复杂一点官方没有提供详细的介绍文档,我们可以通过阅读源代码来找到某些我们需要的东西,如:在directive使用 $parse。
模块化比较大胆的引入了Java的一些东西(依赖注入),能够很容易的写出可复用的代码,对于敏捷开发的团队来说非常有帮助,我们的项目从上线到目前,UI变化很大,在摸索中迭代产品,但是js的代码基本上很少改动。
缺点:
1.验证功能错误信息显示比较薄弱,需要写很多模板标签。
只能有一个,不能嵌套多个视图,虽然有angular-ui/ui-router 解决,但ui-router 对于URL的控制不是很灵活,必须是嵌套式的。
3.对于特别复杂的应用场景,貌似性能有点问题,特别是在Windows下使用chrome浏览器,不知道是内存泄漏了还是什么其他问题,没有找到好的解决方案,奇怪的是在IE10下反而很快,对此还在观察中。
4.这次从1.0.X升级到1.2.X,貌似有比较大的调整,没有完美兼容低版本,升级之后可能会导致一个兼容性的BUG,具体详细信息参考官方文档AngularJS,对应的中文版本:Angular 1.0到1.2 迁移指南,现在angularjs4都出来了,但是使用angularjs2的比较多。
提倡在控制器里面不要有操作DOM的代码,对于一些jQuery 插件的使用,如果想不破坏代码的整洁性,需要写一些directive去封装插件,但是现在有很多插件的版本已经支持Angular了,最好能够和cordova插件结合进行混合式开发。

javascript如何获取function的形参?

作为一个每天与JavaScript打交道的前端开发,虽然明知这样的问题没人看,但还是忍不住要答一波以正视听。
既然题主强调是“形参(形式参数,formal parameters)”,那我觉得回答说用arguments对象的肯定都不对。arguments是“实参(实际参数,actual parameters)”。
形参: 函数声明时指定的参数声明列表。实参: 函数调用时传递进来的参数列表。
有了以上的概念,再来看题主的问题“javascript如何获取function的形参”。题主其实是想做类似反射的操作,给定一个函数变量,然后得到该函数定义时的参数声明列表。
首先,如果题主并非真的想拿到每个实参的详细信息,而是只需要实参个数,那么简单的使用length属性就可以了。这个方式,对箭头函数(arrow function)也是适用的。
如果题主真的想拿到每个实参的详细信息,那就比较有意思了,因为JavaScript里目前并没有提供直接的方式来实现这个操作,甚至最新的Reflect也帮不上什么忙。好在function的toString方法可以以字符串方式返回函数定义时的代码,这就提供了一个突破口(jiu ming dao cao),可以从function的定义里自行解析出参数列表。
而这也是流行的框架AngularJS实现基于形参的依赖注入(DI)的关键。这里直接给出AngularJS里的相关代码片段。
从代码中可以看到,该方法调用了toString拿到function的定义,使用正则来去除注释并提取形参列表。该实现也同时具备处理箭头函数的能力。
可以看到,这个方法相当的高效,而且兼容性也相当不错,即使参数中存在默认值、解构、可变参数等ES6的新语法,也不会出错,但也不会给出进一步的信息。
如果需要提取参数默认值、分析解构、或者判断是否为可变参数,则需要进一步的逐个分析,这里不再展开讨论。但有个相当简便的方法是,使用JavaScript语法分析器来解析,例如esprima,但可能会有较大的性能开销(可参考)。
另外,如果代码经过压缩,则这种方法就失效了。Angular.js的解决方法是在需要注入的地方,接收一个手动输入的数组作为函数的参数描述(也可以通过给函数设置静态属性提供注入信息),从而不受压缩的影响。但这样增加了开发人员的工作量(每个参数列表都需要重复两遍)。因此,有人开发了叫做ng-annotate的工具,可以集成的构建工具里自动为方法添加参数描述信息。
觉得不错请转发、点赞。
欢迎在评论区留下你的观点。