AngularJS源码解析浅显
2017-08-01 12:06:23 6 举报
AI智能生成
angularJS源码分析,学习angular内部实现
作者其他创作
大纲/内容
预备知识
User.name等价于User['name']
bindJQuery()
内部定义了jqlite的各种方法
如果引用了jQuery的js文件,使用完整版jquery
函数绑定主要使用forEach循环完成
publishExternalAPI()
定义全局angular对象
拓展angular对象的属性
setupModuleLoader
使用ensure方法确保对象存在,如果对象存在直接返回,如果对象不存在则创建一个
angular=ensure(window,'angular',Object)等价于angular=window.angular
return ensure(angular,'module',function())等价于return window.angular.module()
return function module(name,requires,configFn)
return ensure(modules,name,funtion())
modules负责保存所有的模块
定义moduleInstance
_invokeQueue
各种服务
_configBlocks
.config()
_runBlocks
.run()
使用invokeLater函数将各种服务放到该模块调用队列中
总结上面:返回一个拥有三个队列以及各种服务的模块实例
angularModule=setupModuleLoader(window)等价于angularModule=window.angular.module(),也就是说angularModule是一个函数
尝试获取ngLocale服务,没有的话就自己加载一个
加载ng模块
angularInit()
先判断当前元素是否是ng-app
如果不是判断子元素是否是ng-app
只要有一个是,就调用bootstrap函数启动appElement对应的module
doBootstrap()
判断元素是否已经拥有注入器
压入$rootElement,也就是包含ng-app的元素
压入ng模块
createinjector()
providerCache
包含各种服务的原型
instanceCache
通过各种服务的$get方法获取的服务实例
调用createInternalInjector
return{}
invoke:invoke
通过annotate方法获取需要注入的服务
将各种服务压入参数表
获取函数
执行函数
instantiate:instantiate
创建实例
get:getService
如果缓存中有,就从缓存中直接返回
否则注册一个,放到缓存中并返回
annotate:createInjector.$$annotate
如果是函数,则通过正则表达式获取参数
如果是数组,则除了最后一项是函数,其他都是函数依赖
has:function()
判断是否包含某个服务
加载模块
总结
angularJS通过缓存保存创建出来的服务实例
通过正则表达式或者解析数组获取函数的依赖
0 条评论
下一页