zepto源码分析(一)——入口
他山之石,可以攻玉。
最外层
zepto最外层的基本结构是一个匿名的立即执行函数:
1 | var Zepto = (function(){ |
立即执行函数(IIFE)的主要特征是:
- 使用函数表达式声明一个函数
- 在其后使用括号直接调用
- 利用了JavaScript的函数作用域的概念,防止其他代码对该函数内部造成影响,而且不会创造全局变量防止污染全局空间。
从上面的代码可以看到,这个匿名立即执行函数返回了一个$
,这里的$
指的是立即执行函数内部的变量,而不是全局变量的$
。$
又被赋值一个函数,并返回一个zepto.init(selector, context)
这个匿名立即执行函数内部的自定义函数。
到这里可以看到,平时我们使用zepto的时候比如:$('p')
,会执行到$ = function(selector, context)
这一个函数,然后又执行到zepto.init(selector, context)
函数,而p
这一个字符串也会作为selector
参数传到$ = function(selector, context)
,然后再传到zepto.init(selector, context)
函数里。
最后两行将Zepto暴露为全局变量,并利用JavaScript运算符特性,判断$
是否被占用,如果没有被占用,就将$
赋值为Zepto
,这样就能够使用$
调用Zepto,比如:$('p')
。