随笔分类 - angular源码分析
在这里解读angular的源代码
摘要：这一期中，我不会分析源码，只是翻译一下"https://docs.angularjs.org/api/ng/service/$compile",当然不是逐字逐句翻译,讲解指令应该如何编写，下一期再接着讲$compile的源码。我觉得，懂得如何使用angular可能对童鞋们更有用。 先说点废话 :上一...
阅读全文
摘要：在今天的内容,我将重点分析指令的注册。指令首先通过module.direcitve来定义,也就是注册，但是module.directive仅仅是延迟执行了$compileProvider.directive,而在$compileProvider.directive中又定义了指令数组的服务。指令在需要的时候会通过服务的方式实例化（只实例化一起，是单例模式）出来。
阅读全文
摘要：$interpolate的功能很简单，将绑定在html的变量解析成字符串。然后，由于我们的整个angular应用都会大量的用到数据绑定，所以$interpolate将会被着频繁的调用。如果在$interpolate中存在效率问题，势必会影响到整个应用的执行效率，不是造成浏览器卡顿就是造成整个页面崩溃。$interpolate是angular内部的一个服务，我们在写应用的时候一般不回去调用，它的主要服务对象是$compile，我们讲它也是为讲$compile服务的。
阅读全文
摘要：本文分别从$sec的引入原因，使用方法和源码分析三个方面讲解了$sec这个可能会被大多数人忽略的一个服务。SEC和CSP的引入都是为了增加angular的安全性，为编写更加不易被攻击的web应用服务的。在上一期中，我们看到angular的作者为了这个目的，不惜花近两千行的代码来实现一个可靠的表达式编辑器，由此，我们在写代码的时候要求自己注意一下这方面的问题是不过分的。
阅读全文
摘要：我们在上一期中讲 $rootscope时,看到$rootscope是依赖$prase,其实不止是$rootscope,翻看angular的源码随便翻翻就可以发现很多地方是依赖于$parse的。而$parse的源码打开一看,它的代码量有接近两千行。翻开angular的api文档,官方只给出了简短的解释"Converts Angular expression into a function(将一个angular的表达式转化为一个函数)",心中神兽奔腾————就这么点功能为什么要“两千行代码”呢。
阅读全文
摘要：在angular中，$scope是一个关键的服务，可以被注入到controller中，注入其他服务却只能是$rootscope。scope是一个概念，是一个类，而$rootscope和被注入到controller中的一个具体的$scope都是一个个具体的对象。$rootscope之所以被称为"root"的原因就是他是所有scope的祖先，$rootscope是在angular启动流程中建立的（上上期讲过），而被注入到controller中的$scope则是在视图创建的时候通过父辈的$scope.$new制造出来的，在视图销毁的时候，$scope会被跟着销毁。$scope是链接视图和controller的重要手段，controller则是可以与服务进行链接，将服务提供的功能进行组合，然后丢给$scope,$scope则将这些传递给视图，让它显示给用户。
阅读全文
摘要：今天做了一些图来说明angular，由于angular实在太复杂了，不知道用什么图表示比较好，所以就胡乱画了一些，希望有人能看得懂。 一、源码文件编译合并顺序图<img src="http://images2015.cnblogs.com/blog/830281/201511/830281 2015...
阅读全文
摘要：在前面，我们讲了angular的目录结构、JQLite以及依赖注入的实现，在这一期中我们将重点分析angular的整个框架的加载流程。下一期，我们讲画一张图来总结前面的流程：可以认为我们前面讲的都是angular的本身运作的框架代码，其中精妙之处甚多。
阅读全文
摘要：昨天晚上写完[angular源码分析：angular中jqLite的实现——你可以丢掉jQuery了](http://www.cnblogs.com/web2-developer/p/angular-5.html)，给今天定了一个题**angular源码分析：injector.js文件，以及angular的加载流程**，但是想了想，加载流程还是放到后面统一再讲比较好。
如果你没有看过笔者的[angular源码分析：angular中的依赖注入式如何实现的](http://www.cnblogs.com/web2-developer/p/angular-2.html)，可以点击看看，在其中讲过的内容，我将不会再这里重复，这一期将作那一期的补充。
阅读全文
摘要：这里可以看到，它直接调用了element.cloneNode。而在ie8下这个方法在复制H5新元素（section,footer,header,em等）时，会自动变成“：element”（即:section,:footer,:header,:em）,而angular中ng-if，ng-repeat等都使用了jqLiteClone。这就会导致css选择器失败，样式就变得不堪入目了。笔者阅读了jQuery的源码，结果发现它依然是一个坑，一层h5元素的情况处理了，多层的确没有处理。并且[这个bug](http://bugs.jquery.com/ticket/6153)官方也貌似没打算修复。不得已，写了一个修复文件： ie8_ele_clone.js,并且把angular的jqLiteClone函数改了。
阅读全文
摘要：有朋友说，读angular源码，直接看编译后的，多好，不用管模块间的关系，从上往下读就好了。但是在我看来，阅读编译后的源码至少有两点不好。
1.编译已经将所有的代码合并在一起了，这会丢失掉作者模块设计的思想，不利于理解代码架构的精髓，甚至想理解代码都很难。
2.编译合并后的angular代码有2万多行，想要看完，早已望而生畏。相反阅读编译前的代码，可以一个模块一个模块的逐个击破。
但是编译前的源码中的确文件一大堆，一开始靠不清楚都是拿来干嘛的，这可能是初学者源代码阅读一个很大的障碍。我今天要做的事就是把angular的angular的目录和文件的结构理清分享给大家。
阅读全文
摘要：本文分析了angular的一些工具函数（比如equals,copy和各种类型判断函数）的源代码，其中总结了一些js代码编写的小技巧，希望能给读者带来收获。笔者在书写js函数时，其中对入参的检查，感到相当困惑，不知道到底是否改写，写的话是浪费墨水增加js文件的大小并且掉入一种无休止的重复劳动，而不写的话又感觉代码的健壮性不好，会给函数的调用者造成麻烦。借鉴了angular源码中的各种处理方式，获得了一定收获。
阅读全文
摘要：依赖注入和控制反转差不多是一个概念，是编程中一种重要的解耦手段。依赖注入不是目的，它是一系列工具和手段，最终的目的是帮助我们开发出松散耦合、可维护、可测试的代码和程序。
阅读全文
摘要：本文主要介绍angular1.x的源代码获取，为后期正式对angular源码分析做铺垫，其中包括了git的安装和从github.com上获取源代码，以及angular1.x构建所依赖的开发和测试环境安装。
阅读全文