zepto.js 源码分析

尝试分析 Zepto 源码

从 `# 开始

1
2
3
4
 <script src="js/zepto.js"></script>
<script>
console.log($);
</script>

控制台打印 $ 输出

1
2
3
ƒ (selector, context){
return zepto.init(selector, context)
}

可见 $ 应该是一个全局变量,然后给它赋值一个函数,查看源码第235行,写了如下:

1
2
3
$ = ƒunction (selector, context){
return zepto.init(selector, context)
}

噢,确实是这样,但为什么没用var来声明,找找,发现其实是定义了的,在第9行声明了var $ ,故其实zepto可写成如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var Zepto = (function(){
var $

// ...省略N行代码...

$ = function(selector, context){
return zepto.init(selector, context)
}

// ...省略N行代码...

return $
})()

window.Zepto = Zepto
window.$ === undefined && (window.$ = Zepto)

然后我们发现 $ 其返回值又是一个zepto.init()应该又是一个函数,那我再打印$()应该就是返回init()执行结果,如下:

1
2


返回了一个叫 Z的对象

© 2019 lvbin's Blog All Rights Reserved.
Theme by hiero