通过jQuery源码学习javascript(三)
第一篇中有位博友提出了以下的问题,我也不太明白,如果有明白的,能否告知一、二。

var str = "test";
for(var a in str){
console.log(a + ":" + str[ a ]);
}
输出结果
这是一个字符串对象,在使用for的时候,会出现上面的情况。

自调用匿名函数(function(){})(window)
(function(window, undefined){
// jquery code
})(window);
代码解析:
第一个括号:创建一个匿名函数。
第二个括号:立即执行。
传入window变量原因:
使window变量由全局变量变为局部变量,不需要将作用域链回退到顶层作用域,以便更快的访问window。
在参数列表中增加undefined原因:
在自调用匿名函数的作用域内,确保undefined是真的未定义。
这样设计的好处:
创建私有命名空间。函数体内的变量和方法,不会影响全局空间。不会与其他程序的变量发生冲突。
功能扩展extend()
根据一般的设计习惯,可以直接通过点(.)语法实现,或者在prototype对象结构中增加一个属性即可。——jQuery框架是通过extend()函数来实现功能扩展的。
我们也做个类似的方法。——把指定参数对象包含的所有属性复制给cQuery或cQuery.prototype对象。
(function(){
var
_cQuery = window.cQuery,
cQuery = function(){
return new cQuery.fn.init();
};
cQuery.fn = cQuery.prototype = {
init : function () {
return this;
}
};
cQuery.fn.init.prototype = cQuery.fn;
cQuery.extend = cQuery.fn.extend = function( obj ) {
for (var prop in obj) {
this[ prop ] = obj[ prop ];
}
return this;
}
cQuery.fn.extend({
test : function() {
console.log('测试!');
}
});
window.C = window.cQuery = cQuery;
})();
// 调用方式
C().test();
好处:
1、方便用户快速扩展jQuery框架的功能,不会破坏jQuery框架的原型结构。
2、方便管理。
注意:
通过prototype扩展的对象,我们必须通过实例化函数来调用(如cQuery().test(),而不能使用cQuery.test())
对象url参数化param()
(function(){
var
_cQuery = window.cQuery,
cQuery = function(){
return new cQuery.fn.init();
};
cQuery.fn = cQuery.prototype = {
init : function () {
return this;
}
};
cQuery.param = function(obj) {
var prefix, s = [];
for ( prefix in obj ) {
s[ s.length ] = encodeURIComponent( prefix ) + "=" + encodeURIComponent( obj[ prefix ]);
}
return s.join( "&" );
}
cQuery.fn.init.prototype = cQuery.fn;
window.C = window.cQuery = cQuery;
})();
var param = cQuery.param({"name":"chuanshanjia", "age":30});
console.log( param );
输出结果

对象url参数化:有利于结构化,易于维护。如果在url后面加一坨的参数列表,难道看着不眼晕吗?
总结
暂时写到这里,如果大家有所补充,那最好不过了。——大家多交流互相学习下。
通过jQuery源码学习javascript(三)的更多相关文章
- jquery源码学习笔记三:jQuery工厂剖析
jquery源码学习笔记二:jQuery工厂 jquery源码学习笔记一:总体结构 上两篇说过,query的核心是一个jQuery工厂.其代码如下 function( window, noGlobal ...
- jquery 源码学习(三)
jQuery源码分析-03构造jQuery对象-源码结构和核心函数,需要的朋友可以参考下. 作者:nuysoft/高云 QQ:47214707 EMail:nuysoft@gmail.com 毕竟 ...
- jquery源码学习(三)—— jquery.prototype主要属性和方法
上次我们学习了jquery中的主要对象jQuery和一些变量,现在我们开始学习jquery的原型 98行声明了jQuery.fn = jQuery.prototype = {} 285行jQuery. ...
- jquery源码学习(一)——jquery结构概述以及如何合适的暴露全局变量
jQuery 源码学习是对js的能力提升很有帮助的一个方法,废话不说,我们来开始学习啦 我们学习的源码是jquery-2.0.3已经不支持IE6,7,8了,因为可以少学很多hack和兼容的方法. jq ...
- jQuery源码学习感想
还记得去年(2015)九月份的时候,作为一个大四的学生去参加美团霸面,结果被美团技术总监教育了一番,那次问了我很多jQuery源码的知识点,以前虽然喜欢研究框架,但水平还不足够来研究jQuery源码, ...
- jquery 源码学习(一)
从上边的注释看,jQuery的源码结构相当清晰.条理,不像代码那般晦涩和让人纠结 1. 总体架构 1.1 自调用匿名函数 self-invoking anonymous function 打开jQ ...
- jquery 源码学习(四)构造jQuery对象-工具函数
jQuery源码分析-03构造jQuery对象-工具函数,需要的朋友可以参考下. 作者:nuysoft/高云 QQ:47214707 EMail:nuysoft@gmail.com 声明:本文为原 ...
- 读艾伦的jQuery的无new构建,疑惑分析——jquery源码学习一
背景: 有心学习jquery源码,苦于自己水平有限,若自己研究,耗时耗力,且读懂之日无期. 所以,网上寻找高手的源码分析.再经过自己思考,整理,验证.以求有所收获. 此篇为读高手艾伦<jQuer ...
- jquery 源码学习(*)
最近在做日志统计程序,发现对方的程序是在Jquery基础上进行开发的,而公司的网站的框架是prototype.而且我也早就想了解一下Jquery源码,故决定研究Jquery源码,模拟它的方法 Jq ...
随机推荐
- 【java集合框架源码剖析系列】java源码剖析之LinkedList
注:博主java集合框架源码剖析系列的源码全部基于JDK1.8.0版本. 在实际项目中LinkedList也是使用频率非常高的一种集合,本博客将从源码角度带领大家学习关于LinkedList的知识. ...
- 【一天一道LeetCode】#237. Delete Node in a Linked List
一天一道LeetCode 本系列文章已全部上传至我的github,地址:ZeeCoder's Github 欢迎大家关注我的新浪微博,我的新浪微博 欢迎转载,转载请注明出处 (一)题目 Write a ...
- Hessian探究(一)Hessian入门示例
一.hessian的maven信息: [html] view plain copy print? <dependency> <groupId>com.caucho</gr ...
- Mac下关于->您不能拷贝项目“”,因为它的名称太长或包括的字符在目的宗卷上无效。<-的删除
打开 Terminal 应用程序. 键入: sudo rm -rf注意:在"-rf"后键入一个空格.没有空格该命令将不能执行.在步骤 6 之前请不要按下 Return 键. 打开您 ...
- 《java入门第一季》之泛型方法和泛型接口
一.泛型方法. /* * 泛型方法:把泛型定义在方法上.格式:public <泛型类型> 返回类型 方法名(泛型类型 t) public <T> void show(T t){ ...
- java设计模式---桥接模式
桥接模式的目的是把抽象和具体实现分离,其uml类图如下所示: public interface SendMessage { abstract void send(String message,Stri ...
- Cocos2D中图片加-hd后缀的说明
你可能注意到实际上游戏中的sprite都有2张图片,它都对应该精灵,并包含在资源包中(resource pack): player.png(27x40 pixels)和player-hd.png(do ...
- Synchronize 和 Lock 的区别与用法
一.synchronized和lock的用法区别 (1)synchronized(隐式锁):在需要同步的对象中加入此控制,synchronized可以加在方法上,也可以加在特定代码块中,括号中表示需要 ...
- android studio中使用lambda
环境准备 如果还没有安装Java 8,那么你应该先安装才能使用lambda和stream(译者建议在虚拟机中安装,测试使用). 像NetBeans 和IntelliJ IDEA 一类的工具和IDE就支 ...
- Leetcode_21_Merge Two Sorted Lists
->4->4,return 1->2->3->4->5->6. 思路: (1)题意为将两个有序链表合成一个有序链表. (2)首先,分别对链表头结点判空,如果都 ...