jquery的框架解读(一)

jquery的框架,我想对于大部分使用过js的人来说,都再熟悉不过了。但是却很少有人认真的去学习研究过jquery的源码。下面我就将我前些天研究的这方面的成果与大家分享一下。

这里我采用从整体到细节的讲解方式。

先看jquery的整体框架:

源代码:

(function (){
	//jquery的代码
})();

第一个括号里面是个匿名函数,第二个括号表示马上执行第一个括号里面的代码。

注意:第一个括号后紧跟第二个括号,才可以执行第一个括号内的匿名函数的代码。换句话说,这两个括号是一个整体,要么全要,要么全不要;假如去掉第一个括号,大家可以手动去试一下,会发现不仅不会执行匿名函数,而且还会报js的错误。

第一个括号内的匿名函数是在加载页面的时候开始执行的。

jquery这么一套成熟的js框架,必定会考虑到命名冲突问题,那么jquery是通过什么方式去避免命名的冲突的呢?

在js中,没有命名空间的概念;但是我们可以采用另外一种变通的方式去达到我们的目的------避免命名冲突。就是这里采用的方式了,所有的javascript函数、对象都在代码里面写的匿名函数里面定义,确保了所定义的函数、对象的作用域仅限于该匿名函数内,起到了命名空间的作用。

知识点:采用var 变量名方式定义的js变量是局部变量,没有var的变量是全局的变量,他是作为window的属性出现的。在js里面是很忌讳使用全局变量的,所以大家都尽量的采用var 变量名的方式去定义变量。

既然jquery的变量的作用域是在这个匿名函数里面,那么我们又是如何在这个匿名函数的外面使用到的呢?在jquery中有这么一句话,不知道大家注意到没有:

var jQuery = window.jQuery = function(selector, context)
{//……
};
 

这里让jquery框架的最重要对象jQuery作为window的一个属性出现,这样就可以在其他地方随意的使用了。

我使用的都是$并不是jQuery啊。其实在jquery里面定义了$=jQuery,也即他们是同名对象。

就想document一样,随意使用。

(function (){    
var window = this;
})();

  这样就拿到了Window对象,在这个匿名函数里面可以随意使用window,而且该变量等价于js中的WINDOW对象。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值