当前位置: 代码迷 >> Web前端 >> OOP与jQuery(1):变量和函数
  详细解决方案

OOP与jQuery(1):变量和函数

热度:210   发布时间:2012-09-10 22:20:12.0
OOP与jQuery(一):变量和函数

本系列文章由石川创作,李松峰翻译,W3ctech.com首发,图灵社区转载。

?

解码jQuery系列

光开发源代码是不够的。为了让开源进一步开放,在“解码jQuery”系列中,我们会剖析jQuery的每一个方法。领略jQuery框架之美,同时向这个框架背后的天才们致敬。

?

“OOP与jQuery”是“解码jQuery”系列中的一个子系列,主要讨论jQuery的内部构成及相关的OOP(Object Oriented Programming,面向对象编程)概念。

?

学习OOP概念的最佳方式,就是剖析一个真实的框架。学习某个框架的最佳方式,就是领会其中的OOP概念。

?

jQuery核心(vcore.js)是jQuery的“大脑”,其中涉及五个重要概念:变量(数据)、函数、对象、原型和继承。这五个方面是jQuery核心的五个“”脑叶,又是探求OOP概念的五个“意识”。

整个jQuery库都浓缩在一个jQuery变量中。实际上,core.js中有两个jQuery变量(var jQuery),一个是全局的,另一个是局部的。今天我们就通过jQuery来了解JavaScript中的变量和函数这两个概念。下面就是刚提到的两个jQuery变量。

// 全局 jQuery

var jQuery = (function(){
      //   局部 jQuery
      var jQuery = function(selector, context) {
            //.....
      }
})();

?

1.变量保存数据,函数也是数据

?

? ?我们先来看一看局部的jQuery:

?

// 局部 jQuery

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

?

? ? JavaScript中的函数实际上是数据。也就是说,通过以下两种方式定义jQuery函数,结果是相同的:

// 局部 jQuery

function jQuery (selector, context) {
      // .....
}

// 局部 jQuery

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

?

2.函数可以匿名

?

? ? 再来看一看全局的jQuery:

?

// 全局 jQuery

var jQuery = (function() {
      //  .....
})();

?
? ? 从中把函数部分提取出来,就会发现它是匿名的:

?

function() {

       // .....

}

?

? ?在JavaScript中,可以不把数据赋值给变量,而数据照样可以存在。比如,下面这个字符串可以存在于JavaScript代码 ? ? ?中,而且不会返回任何错误:

?

“I am data and I don't cause error.”

?

? ? 前面第1点提到了“函数是数据”,因此函数也可以独立存在,而不需要被赋值给某个变量。假如你运行上面的匿名函数, ? ? 它100%可以运行,而且不会导致任何错误。那匿名函数有什么用呢?下一点就来回答这个问题。

?

3.匿名函数可以自调用

?

? ? 匿名函数的一个优点是可以作为自调用的函数来使用。举个例子,下面的函数在页面加载时会自动执行,你可以在控制 ? ? ? 台看到输出:

?

var jQuery = (function() {

       console.log("I am self-invoking.");

})();

?

? ? 那为什么要像这样来使用匿名函数呢?因为这样可以在不创建全局变量的情况下执行一些内部操作。jQuery使用匿名自 ? ? 调用函数来完成它的一次性初始化。

  相关解决方案