通过jQuery源码学习javascript(三)


Posted in Javascript onDecember 27, 2012

疑问

第一篇中有位博友提出了以下的问题,我也不太明白,如果有明白的,能否告知一、二。

通过jQuery源码学习javascript(三)

var str = "test"; 
for(var a in str){ 
console.log(a + ":" + str[ a ]); 
}

输出结果
这是一个字符串对象,在使用for的时候,会出现上面的情况。

通过jQuery源码学习javascript(三)

自调用匿名函数(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 );

输出结果

通过jQuery源码学习javascript(三)

对象url参数化:有利于结构化,易于维护。如果在url后面加一坨的参数列表,难道看着不眼晕吗?

总结

暂时写到这里,如果大家有所补充,那最好不过了。——大家多交流互相学习下。

Javascript 相关文章推荐
菜鸟javascript基础资料整理2
Dec 06 Javascript
javascript中的数字与字符串相加实例分析
Aug 14 Javascript
如何设置iframe高度自适应在跨域情况下的可用方法
Sep 06 Javascript
jQuery删除节点的三个方法即remove()detach()和empty()
Dec 27 Javascript
Javascript限制网页只能在微信内置浏览器中访问
Nov 09 Javascript
浅析Javascript中“==”与“===”的区别
Dec 23 Javascript
js+canvas绘制五角星的方法
Jan 28 Javascript
javascript瀑布流式图片懒加载实例
Jun 28 Javascript
JavaScript头像上传插件源码分享
Mar 29 Javascript
详解如何提高 webpack 构建 Vue 项目的速度
Jul 03 Javascript
使用 Vue 绑定单个或多个 Class 名的实例代码
Jan 08 Javascript
使用layui定义一个模块并使用的例子
Sep 14 Javascript
JS原型对象通俗"唱法"
Dec 27 #Javascript
通过jQuery源码学习javascript(二)
Dec 27 #Javascript
js 判断一个元素是否在页面中存在
Dec 27 #Javascript
通过jQuery源码学习javascript(一)
Dec 27 #Javascript
Eval and new funciton not the same thing
Dec 27 #Javascript
Javascript图像处理—虚拟边缘介绍及使用方法
Dec 27 #Javascript
JS 添加网页桌面快捷方式的代码详细整理
Dec 27 #Javascript
You might like
如何用PHP来实现一个动态Web服务器
2015/07/29 PHP
学习YUI.Ext 第七天--关于View&JSONView
2007/03/10 Javascript
ASP.NET jQuery 实例6 (实现CheckBoxList成员全选或全取消)
2012/01/13 Javascript
JS验证日期的格式YYYY-mm-dd 具体实现
2013/06/29 Javascript
js浮点数保留两位小数点示例代码(四舍五入)
2013/12/26 Javascript
js获得页面的高度和宽度的方法
2014/02/23 Javascript
jQuery实现根据类型自动显示和隐藏表单
2015/03/18 Javascript
js由下向上不断上升冒气泡效果实例
2015/05/07 Javascript
JavaScript脚本判断蜘蛛来源的方法
2015/09/22 Javascript
JS实现的仿淘宝交易倒计时效果
2015/11/27 Javascript
JavaScript的String字符串对象常用操作总结
2016/05/26 Javascript
详解闭包解决jQuery中AJAX的外部变量问题
2017/02/22 Javascript
jQuery插件zTree实现删除树子节点的方法示例
2017/03/08 Javascript
Vue开发中整合axios的文件整理
2017/04/29 Javascript
nodejs中实现用户注册路由功能
2019/05/20 NodeJs
利用d3.js实现蜂巢图表带动画效果
2019/09/03 Javascript
layui文件上传控件带更改后数据传值的方法
2019/09/23 Javascript
vue实现员工信息录入功能
2020/06/11 Javascript
[01:14:31]Secret vs VG 2018国际邀请赛淘汰赛BO3 第一场 8.23
2018/08/24 DOTA
Numpy中的mask的使用
2018/07/21 Python
Python实现的矩阵转置与矩阵相乘运算示例
2019/03/26 Python
python画图常规设置方式
2020/03/05 Python
python实现时间序列自相关图(acf)、偏自相关图(pacf)教程
2020/06/03 Python
python两种获取剪贴板内容的方法
2020/11/06 Python
pytorch 把图片数据转化成tensor的操作
2021/03/04 Python
JD Sports法国:英国篮球和运动时尚的领导者
2017/09/28 全球购物
Java面向对象面试题
2016/12/26 面试题
房地产开发计划书
2014/01/10 职场文书
烹调加工管理制度
2014/02/04 职场文书
学校出纳员岗位职责
2014/03/18 职场文书
交通事故赔偿协议书
2014/04/15 职场文书
反腐倡廉演讲稿
2014/05/22 职场文书
小学教师工作总结2015
2015/04/07 职场文书
劳动合同变更协议书范本
2019/04/18 职场文书
详解在OpenCV中如何使用图像像素
2022/03/03 Python
TypeScript实用技巧 Nominal Typing名义类型详解
2022/09/23 Javascript