Ext.js源码研读总结
作者:yemoo 来源:yemoo博客 发布时间:2009-03-04 12:06:00
今天把Ext.js源码又读了一遍,不过这次比较认真。看完代码,有了不少收获也遇到不少问题。
主要总结如下:
1、document.execCommand("BackgroundImageCache", false, true);
该代码主要是为了防止在IE6中背景图片闪烁的问题。详细请看本文:终结IE6下背景图片闪烁问题
2、namespace方法:
namespace : function(){
var a=arguments, o=null, i, j, d, rt;
for (i=0; i<a.length; ++i) {
d=a[i].split(".");
rt = d[0];
eval('if (typeof ' + rt + ' == "undefined"){' + rt + ' = {};} o = ' + rt + ';');
for (j=1; j<d.length; ++j) {
o[d[j]]=o[d[j]] || {};
o=o[d[j]];
}
}
},
从函数的实现可以知道,创建一个复杂的命名空间如"com.soft.module1"可以直接Ext.namespace('com.soft.module1');而不必如示例所示逐级创建:Ext.namespace('com','com.soft','com.soft.module1');
3、num方法
num : function(v, defaultValue){
if(typeof v != 'number' || isNaN(v)){
return defaultValue;
}
return v;
},
要判断是否是有效数字,不能只通过typeof v!='number'来判断,因为有时通过parseInt等方法来将一些无效数字进行转换时,得到的结果是NaN,其typeof的结果是number但不是有效数字,因此要通过typeof v != 'number' || isNaN(v)来判断有效数字。
4、有关leftPad
leftpad : function (val, size, ch) {
var result = new String(val);
//省略其它代码
}
此处将val通过new String显式转换,我想不仅仅是将各类变量转为string,还有一个很重要的原因:防止内存泄露! 对于直接量,当调用它的方法时,JS会自动将其转换为对应的对象,这个过程会出现内存泄露!为了避免这个问题,一般建议将操作直接量改为操作对象。
需要总结的大概也就这些,相比学习到东西来说,让我产生的疑问要更多一些。
无论如何,都列举到这里,一定要慢慢弄清楚,如果那位朋友明白,请给予指教,先谢过了!
1、override方法
override : function(origclass, overrides){
if(overrides){
var p = origclass.prototype;
for(var method in overrides){
p[method] = overrides[method];
}
if(Ext.isIE && overrides.toString != origclass.toString){
p.toString = overrides.toString;
}
}
},
问题:既然判断的时候使用overrides.toString != origclass.toString,但是最后重写toString确实重写p,这如何解释?
2、combine方法
该方法中有一个写法Array.prototype.slice.call(a, 0)用于将类数组的对象转为数组类型,但是发现一个问题:在IE中,dom中的nodeList对象不能通过该方法转换为数组,这是怎么回事?
3、getBody方法
getBody : function(){
return Ext.get(document.body || document.documentElement);
},
问题:getBody方法的调用一般是在页面加载完成后才会调用,而且此函数的意义应该是根据浏览器解析模式来获取到根元素,但是document.body || document.documentElement的写法有什么意义,经我测试,当页面dom完成后,无论是在何种浏览器上,这个表达式返回的都是document.body,也就是不论是标准模式或者怪异模式,document.body都是存在的。这种写法还有什么意义?
4、removeNode方法
removeNode : isIE ? function(){
var d;
return function(n){
if(n && n.tagName != 'BODY'){
d = d || document.createElement('div');
d.appendChild(n);
d.innerHTML = '';
}
}
}() : function(n){
if(n && n.parentNode && n.tagName != 'BODY'){
n.parentNode.removeChild(n);
}
},
问题:在IE中,也是可以通过n.parentNode.removeChild(n);的方法来删除节点的,但这里为什么要对IE做特殊的删除操作?
5、type方法
type : function(o){
if(o === undefined || o === null){
return false;
}
if(o.htmlElement){
return 'element';
}
var t = typeof o;
if(t == 'object' && o.nodeName) {
switch(o.nodeType) {
case 1: return 'element';
case 3: return (/\S/).test(o.nodeValue) ? 'textnode' : 'whitespace';
}
}
if(t == 'object' || t == 'function') {
switch(o.constructor) {
case Array: return 'array';
case RegExp: return 'regexp';
case Date: return 'date';
}
if(typeof o.length == 'number' && typeof o.item == 'function') {
return 'nodelist';
}
}
return t;
},
问题:这个方法我发现存在很多问题:(1)o.htmlElement,什么时候一个对象存在htmlElement。(2)通过typeof o.length == 'number' && typeof o.item == 'function'的方式判断nodeList并不准确,只能在非IE浏览器中获取正确结果,IE中o.item不是函数。(3)if(t == 'object' || t == 'function') 这句话中t=='function'完全多余,这个if语句中根本没有对function类型做处理,此外采用o.constructor的方法判断具体的对象类型有问题,提倡的一种方式是通过Object.prototype.toString.call(o)来判断,后面的isDate和isArray方法通过属性来判断类型同样存在问题。总之这个函数一定是有漏洞的。
6、useShims 至今我仍不清楚这个属性是做什么用的。
一个ext.js就让我发现了这么多疑问,看来JS还需要大大加强啊。


猜你喜欢
- 最近几天仔细研究了一下vertical-align这个属性,结果让我大吃一惊,这个很“资深”的CSS标准竟然在各个浏览器里面的表现都各不相同
- 我们在学习Python的时候,除了用pip安装一些模块之外,有时候会从网站下载安装包下来安装,我也想要把我自己编写的模块做成这样的安装包,该
- 之前爬美团外卖后台的时候出现的问题,各种方式拖动验证码都无法成功,包括直接控制拉动,模拟人工轨迹的随机拖动都失败了,最后发现只要用chrom
- 本文实例讲述了MySQL无法存储Emoji表情问题的解决方法。分享给大家供大家参考,具体如下:数据插入的时候报错:1366 - Incorr
- 一、cv2.contourArea起初使用该函数的时候看不懂返回的面积,有0有负数的,于是研究了一下。opencv计算轮廓内面积函数使用的是
- 为了吸引更多的用户,设计好一个分享海报还是很有必要的。而小程序要生成一个海报还是有点坑的,下面分享下我们打卡小程序的一些经验。分享海报的效果
- 微软建议用Request.BinaryRead()读取表单数据,但由于这种方法读出的是二进制数据,需要对读出的数据逐字节进行分析,生成有意义
- 本文实例讲述了python中__call__内置函数的用法。分享给大家供大家参考。具体分析如下:对象通过提供__call__(slef, [
- 引入:if-else的作用,满足一个条件做什么,否则做什么。if-else语句语法结构if 判断条件:要执行的代码else:要执行的代码判断
- 1、使用mysqldump工具将MySql数据库备份mysqldump -u root -p -c --default-character-
- Java timezone设置和mybatis连接数据库时区设置JVM时区设置springboot工程运行时,需要指定时区,这样获取的时间才
- SQL Server发展至今,关于日期的格式的控制方法,有传统的方法,比如CONVERT(),也有比较便利的新方法,比如FORMAT();同
- $("input").attr("checked","checked") 设置以
- 封装是一个将Python数据对象转化为字节流的过程,拆封是封装的逆操作,将字节文件或字节对象中的字节流转化为Python数据对象,不要从不收
- CLI工程全局安装vue-clinpm install -g @vue/cli通过cli创建uni-app项目 vue creat
- 本文实例讲述了python写入中英文字符串到文件的方法。分享给大家供大家参考。具体分析如下:python中如果使用系统默认的open方法打开
- PHP chr() 函数实例从不同 ASCII 值返回字符:<?php echo chr(52) . "<br>
- 本文实例讲述了Python实现的微信公众号群发图片与文本消息功能。分享给大家供大家参考,具体如下:在微信公众号开发中,使用api都要附加ac
- 说实话,第一次写这么长的Python代码,期间遇到了很多问题,但是,最终还是完成了,花了我一天半的时间。该程序实现了用户的增,删,改,查,主
- 已经获取微信公众号发布的图片,但不能正常显示 ,提示:此图片来自微信公众平台 未经允许不得引用。 这是怎么回事呢?遇到这