通过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 相关文章推荐
WEB页子窗口(showModalDialog和showModelessDialog)使用说明
Oct 25 Javascript
javascript cookies操作集合
Apr 12 Javascript
jquery 之 $().hover(func1, funct2)使用方法
Jun 14 Javascript
javascript:;与javascript:void(0)使用介绍
Jun 05 Javascript
jQuery 实现侧边浮动导航菜单效果
Dec 26 Javascript
AngularJS基础 ng-keyup 指令简单示例
Aug 02 Javascript
JS常见创建类的方法小结【工厂方式,构造器方式,原型方式,联合方式等】
Apr 01 Javascript
vue动态生成dom并且自动绑定事件
Apr 19 Javascript
vue之nextTick全面解析
May 17 Javascript
Vue 仿QQ左滑删除组件功能
Mar 12 Javascript
深入理解基于vue-cli的webpack打包优化实践及探索
Oct 14 Javascript
详解Vue的异步更新实现原理
Dec 22 Vue.js
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
杏林同学录(六)
2006/10/09 PHP
PHP autoload与spl_autoload自动加载机制的深入理解
2013/06/05 PHP
PHP使Laravel为JSON REST API返回自定义错误的问题
2018/10/16 PHP
php使用lua+redis实现限流,计数器模式,令牌桶模式
2019/04/04 PHP
短信提示使用 特效
2007/01/19 Javascript
利用jQuery 实现GridView异步排序、分页的代码
2010/02/06 Javascript
深入理解JavaScript 闭包究竟是什么
2013/04/12 Javascript
js控制表单奇偶行样式的简单方法
2013/07/31 Javascript
jQuery实现鼠标可拖动调整表格列宽度
2014/05/26 Javascript
jQuery实现冻结表头的方法
2015/03/09 Javascript
jQuery实现图片预加载效果
2015/11/27 Javascript
JS实现的在线调色板实例(附demo源码下载)
2016/03/01 Javascript
JavaScript实现瀑布流图片效果
2017/06/30 Javascript
Node.js简单入门前传
2017/08/21 Javascript
JavaScript中toLocaleString()和toString()的区别实例分析
2018/08/14 Javascript
React事件处理的机制及原理
2018/12/03 Javascript
vue与bootstrap实现简单用户信息添加删除功能
2019/02/15 Javascript
详解Vue中组件传值的多重实现方式
2019/08/16 Javascript
浅谈vue异步数据影响页面渲染
2019/10/29 Javascript
python实现问号表达式(?)的方法
2013/11/27 Python
python读取oracle函数返回值
2016/07/18 Python
python 列表删除所有指定元素的方法
2018/04/19 Python
numpy中以文本的方式存储以及读取数据方法
2018/06/04 Python
Pyqt5 实现跳转界面并关闭当前界面的方法
2019/06/19 Python
python tkinter库实现气泡屏保和锁屏
2019/07/29 Python
Python学习笔记之函数的定义和作用域实例详解
2019/08/13 Python
30秒学会30个超实用Python代码片段【收藏版】
2019/10/15 Python
在Python中利用pickle保存变量的实例
2019/12/30 Python
c/c++某大公司的两道笔试题
2014/02/02 面试题
《十六年前的回忆》教学反思
2014/02/14 职场文书
校庆团日活动总结
2014/08/28 职场文书
关于有小孩的离婚协议书
2014/10/26 职场文书
医学生自荐信范文
2015/03/05 职场文书
运动会宣传稿100字
2015/07/23 职场文书
小学六一儿童节活动开幕词
2016/03/04 职场文书
Python之matplotlib绘制饼图
2022/04/13 Python