`
黄继华
  • 浏览: 45009 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

1.1 jQuery--总体框架

 
阅读更多

1.11自调用匿名函数self-invoking anonymous function

打开jQuery源码,首先我们可以看到这样的代码结构:
( function(widow,undefined){
    //code ....
})(window)
  1. 这是一个自调用匿名函数。那到底是什么呢?在第一括号内,创建一个匿名函数;第二个括号,表示立即执行。 → what
  2. 那么为什么要创建一个“自调用匿名函数”呢?
通过定义一个匿名函数,创建一个“私有”的命名空间,该命名空间的变量和方法,不会破坏全局的命名空间。
这一点很重要也非常有用,也是一个js框架必须的要支持的功能。jQuery被应该到海量的javaScript程序当中,必
须保证jQuery创建的变量不能和导入它的程序所使用的变量发生冲突。
3. 匿名函数从语法上叫 “函数直接量”,JavaScript语法需要包围匿名函数的括号,但是事实上自调用匿名函数有2中写法(注意红色括号
//第一种
(function() {
console.info( this );
console.info( arguments );
}( window ) );

//第二种
(function() {
console.info( this );
console.info( arguments );
})( window );

4.为什么要传入window呢?

通过传入window变量,使得window由全局变量变为局部变量,当在jQuery代码块中访问window时,不需要将作用域链回退到顶层作用域,这样可以更快的访问window;这还不是关键所在,更重要的是,将window作为参数传入,可以在压缩代码时进行优化,看看jquery-1.6.1.min.js:

(function(a,b){})(window);// window被优化为a

5.为什么要在在参数列表中增加undefined呢?

自调用匿名函数的作用域内,确保undefined是真的未定义。因为undefined能够被重写,赋予新的值。

undefined = "now it's defined";

alert( undefined );

浏览器测试结果:

浏览器

测试结果

结论

ie

now it's defined

可以改变

firefox

undefined

不能改变

chrome

now it's defined

可以改变

opera

now it's defined

可以改变

6.注意到源码最后的分号了吗?

分号是可选的,但省略分号并不是一个好的编程习惯;为了更好的兼容性和健壮性,请在每行代码后加上分号并养成习惯。

1.12 总体架构

接下来看看在自调用匿名函数中都实现了什么功能,按照代码顺序排列:

(function( window,undefined) {

//构造jQuery对象

varjQuery =function( selector, context ) {

returnnewjQuery.fn.init( selector, context, rootjQuery );

}

//工具函数Utilities

//异步队列Deferred

//浏览器测试Support

//数据缓存Data

//队列queue

//属性操作Attribute

//事件处理Event

//选择器Sizzle

// DOM遍历

// DOM操作

// CSS操作

//异步请求Ajax

//动画FX

//坐标和大小

window.jQuery = window.$ = jQuery;

})(window);

--------------------------

通过jQuery(xxx)的调用实现没有生成对象,它的this是指向window对象的,那么jQuery的那些实例方法是怎么样继承过来的呢?接下来看一下:

varjQuery =window.jQuery=function( selector, context ) {

returnnewjQuery.fn.init( selector, context, rootjQuery );

}

这是jQuery的总入口,jQuery对象不是通过new jQuery来继承prototype中的方法,而是jQuery.fn.init函数生成的对象。

1.2 jQuery ---- 正则表达式



分享到:
评论

相关推荐

    大数据功能模块概要设计-V1.1Word版.docx

    - **开发框架**:Java服务端推荐Struts2+Spring3+iBatis或MyBatis,前端Web端推荐使用jQuery1.7.2版本,兼容IE6、7、8浏览器,UI组件需与jQuery兼容。 这份设计文档旨在规划大数据系统的整体结构,确保系统的稳定...

    大数据功能模块概要设计_V1.1.docx

    《大数据功能模块概要设计》V1.1的文档详细阐述了大数据系统的设计与构建,主要涵盖系统总体架构、通用组件、技术选型等方面。以下是关键知识点的详细说明: 1. **系统总体架构**: - 系统分为业务库、公共基础...

    大数据功能模块概要设计_V1.1.pdf

    - **基础页面组件**:前端使用jQuery作为基础JS框架,考虑到兼容性,推荐使用jQuery UI框架如easyui、jquery ui或dwz。组件包括图表、编辑器、表单验证、listbox、日期组件、进度条、对话框、按钮、Grid、Tree、...

    项目技术架构选型方案报告

    - **组件选择**:根据具体需求选取合适的前端库和框架,如Bootstrap、jQuery等,以提升用户体验和开发效率。 #### 案件导入导出架构设计 - **设计要点**: - 支持批量导入导出功能,确保数据完整性和一致性。 - ...

    基于html静态花店购物电商网站页面设计与实现.rar(论文+毕业设计) div+css+jquery

    2.3 jquery开发框架介绍 7 3 系统的需求分析 8 3.1可行性分析 8 3.1.1技术性可行性 9 3.1.2经济性可行性 9 3.1.3操作性可行性 10 3.2需求分析 10 3.2.1系统总体概述 10 3.2.2功能性需求 11 3.3非功能性需求 12 4 ...

    jQuery leonaScroll 1.1 自定义滚动条插件(推荐)

    总体来说,jQuery leonaScroll是一个功能丰富、使用方便的自定义滚动条解决方案。它通过简洁的API和灵活的配置选项,为Web开发者提供了一个优雅的方式来增强网页的用户交互体验。随着1.1版本的发布,leonaScroll在...

    SQLServer基础篇

    1. **DLT算法核心理念**:该章节介绍了基于DLT模型的高维数据流聚类算法的核心理念、总体框架及其实现细节。 2. **算法特点**:介绍了DLT算法的独特之处,如高效性、准确性等。 3. **算法实现**:详细描述了DLT算法...

    基于JavaEE的后勤管理系统的设计与实现.docx

    1.1 系统需求 - 物资管理:系统应能够进行物资的采购、入库、出库、库存查询等操作,确保物资的合理调配。 - 人力资源管理:记录员工信息,处理考勤、工资、福利等事务,支持人力资源的合理分配。 - 设施维护:记录...

    基于JSP的Famly-of-Names手表销售网设计与实现毕业设计.pdf

    3. 项目总体框架设计 3.1 网站总体设计图 网站采用分层架构,包括前端展示层、业务逻辑层和数据访问层,确保各部分职责明确,易于维护和扩展。 3.2 前端静态网页总体设计 前端设计注重用户体验,采用响应式布局,...

    基于Springboot的新风图书馆管理系统的设计与实现.docx

    - **前端框架**:Bootstrap、jQuery - **后端框架**:Springboot - **安全框架**:Spring Security - **持久层**:Mybatis - **数据库**:MySQL #### 2.1 可行性分析 - **经济可行性**:考虑到开发成本和后期维护...

    基于jsp的网上书店系统源码数据库.doc

    - **使用框架**:考虑使用Bootstrap等前端框架,简化布局和样式设计。 - **响应式设计**:确保网页在不同设备上的良好显示效果。 - **交互效果**:利用jQuery等库增强页面的动态效果和用户体验。 综上所述,基于JSP...

    基于WEB的航班查询和订票系统概要设计说明书

    - **前端框架**:Bootstrap、jQuery ##### 4.3 总体结构 系统采用MVC架构模式进行设计,主要包括: - **Model层**:负责数据的存储与处理。 - **View层**:负责页面显示。 - **Controller层**:负责业务逻辑处理。 ...

    基于springboot的某大学外卖系统源码数据库.doc

    系统总体框架 ##### 2.1 模型结构 采用MVC(Model-View-Controller)架构模式进行设计: - **Model(模型层)**:负责业务逻辑处理和数据持久化操作。 - **View(视图层)**:展示界面给用户,通常由...

    基于SpringBoot的闲置房屋搜索平台设计与实现.docx

    ##### 1.1 SpringBoot框架简介 SpringBoot是Spring框架的一个子项目,旨在简化Spring应用的初始搭建以及开发过程。它内置了一个轻量级容器,可以直接运行在任何支持Java的环境中,而无需外部容器。SpringBoot的主要...

    基于ssm+jsp在线云音乐系统源码数据库.doc

    - **前端**:使用Bootstrap框架提升用户体验,结合jQuery简化DOM操作。 - **后端**: - **Spring**:作为依赖注入容器,管理Bean的生命周期。 - **SpringMVC**:处理HTTP请求,转发至相应控制器。 - **MyBatis**...

Global site tag (gtag.js) - Google Analytics