简单其实不简单

JS中创建RegExp时偷懒可是要受折磨的

我以前做JS的匹配时总是这样使用：

[javascript]
// 比如下面对数字进行匹配的语句
function email(value){
return /^([0-9a-zA-Z]+([_.-]?[0-9a-zA-Z]+)*@[0-9a-zA-Z]+[0-9,a-z,A-Z,.,-]*(.){1}[a-zA-Z]{2,4})+$/ig.test(value);
}

而不是：

[javascript]
// 比如下面对email进行匹配的
function email(value){
var reg=new RegExp(“^([0-9a-zA-Z]+([_.-]?[0-9a-zA-Z]+)*@[0-9a-zA-Z]+[0-9,a-z,A-Z,.,-]*(.){1}[a-zA-Z]{2,4})+$”, ‘ig’);
return reg.test(value);
}

这样写，一般下好像没什么问题，但今天我遇到个“很有意思”的问题：在多次刷新看返回结果后，发现结果总是在true、false之间轮回。

如何导致的我到现在也没弄明白，但解决的办法就是像上面那样先用new RgExp创建正则对象，这样返回的结果就没有问题了。可点Demo查看例子（注意，例子中只有email是有问题的！要看到“特效”，你得先在email处写上个正确的 ^ _^////）

我对jQuery、mootools的理解

我接触的第一个JS框架是jQuery，当时还刚发布没多久，版本是1.1.3。使用后我就爱了它，很多东西不用自己去写了，很方便，尤其是对DOM的操作，真的没得说。

但在去年的七月份了解到mootools的存在，并很快喜欢上了；去了解其它的框架也是因为对jQuery越来越不满了，使用jQuery所写的代码在过几个月去查看或除bug时时件很郁闷的事，得看段时间才能明白一行代码都干了些什么，因为jQuery的链式的，一行中有所进行的操作可能有很多。而且jQuery为了“傻瓜化”，对多个与单个之间的区分越来越不明显了；写代码是舒服了，但性能却是越来越糟糕了。看看现在的新手写的代码（其实我自己也是新手 ^_^!），有时让我哭笑不得。

mootools就完全不一样了，对不同类型提供不同的操作函数，代码的可读性、性能等方面更多的是取决于编码的作者，而不是框架本身的优化。mootools是OOP化的，与jQuery是不同概念的物质。用个比喻来比较下两者的话那就是公交车与车零部件的区别：

jQuery是提供了一条又一条公交线路，要到目的地上不同的公交车就可以了，但如果你要去的地方公交线路上没有，你就没办法了，只有坐交公车到离目的地最近的一个站台然后自己想办法；而mootools就不同了，它提供的是车轮子、车门等配件，得自己组装成一辆车，前期可能会辛苦，但一担组装完成了，那想去哪都可能了。

几个星期前有一项目让我真正的使用起mootools，还是有很大的不适应啊！^_^//// 给我最大的感触是mootools的选择器没有jQuery强大，性能也没有jQuery好；mootools中的$、$$、$E、$ES等函数有点晕，感觉有点繁琐了！潜意识又向jQuery倾斜了，哇哈哈！谁叫我最先用的是它呢！（思路跑到可恶的微软上了，让我习惯上了、依赖上了，现要进入linux世界真不容易，谁叫我了解计算机时只知道个windows）

现在工作中愈加发现OOP的思想的好，不管在修改、分离方面都强于一般的纯函数方式。^_^！

发现JS里个很有意思的特性

发现JS里个很有意思的特性，看下面的代码

[javascript]
var arr=['a', 'b','c'];
alert(arr.sort);
alert(arr.sort());

这两行alert看起来差不多，但效果完全不一样了，第一个是作为arr的属性调用sort的；第二个则是作为arr的一个方法调用的。alert出来的结果自己不一样了。

再想想JS中对对象的调用方法：

[javascript]
var obj = {a:’aa’,b:’bb’}
alert(obj.a);
alert(obj['a']);

所以我想使用访问数组的方法去访问对象的方法应该也可以：

[javascript]
var arr=['a', 'b','c'];
alert(arr['sort']);

出来的结果同样是作为arr的属性被调用，这样也成，呵呵，还真有意思。

再想想这个特性要怎么利用。回到发现这特性之初，sort()本来是array的排序方法，在看人家的代码时发现这样写，似乎是用来判断arr是否为数组类型的对象。

再回想下，前几天面试时教官同样问到这问题，当时一无所知的囧样，郁闷！

回到话题，所以这特性可用来判断数据类型的，可以找些只有一种类型的数据才有的方法来判断；还有的话就是可以用来看JS的开发者的写的代码了！^_^////

JavaScript对css的一些操作

[javascript]
function $random(min, max){
    return Math.floor(Math.random() * (max - min + 1) + min);
};

// JavaScript对css的一些操作
var CSSClass = {
    has: function(el, className){
        if (typeof el == "string") el = document.getElementById(el);
        var cl = el.className;
        if(!cl) return false;
        if(cl == el) return true; //只有一个class
        return (' ' + className + ' ').indexOf(' ' + cl.toString() + ' ') > -1;
    },

    add: function(el, className){
        if (typeof el == "string") el = document.getElementById(el);
        if (!CSSClass.has(el, className))
            el.className = el.className == ''?className:(el.className + ' ' + className);
    },

    remove: function(el, className){
        if (typeof el == "string") el = document.getElementById(el);
        if (CSSClass.has(el, className))
            el.className = CSSClass.trim( (' ' + el.className + ' ').replace(' '+className+' ', ' ') );
    },

    toggle: function(el, className){
        CSSClass.hasClass(el, className) ? CSSClass.removeClass(el, className) : CSSClass.addClass(el, className);
    },
    trim: function(str){
        return str.replace(/(^\s*)|(\s*$)/g, '');
    }
}

var els = document.getElementById('content')[0];
var els = getElementsByClass('article', els, 'div');
for(var i=0,j=els.length; i<j; i++){
    var h3 = els[i].getElementsByTagName('h3')[0];
    var cls = 'title' + $random(1, 8).toString();
    CSSClass.add(h3, cls);
}

不用多说什么，知道的看看就知道，不知道的说了也没用，过点时间搞成个小库，自己好用，呵呵！

我的firefox常用插件[2010-08-26更新]

Firebug

YSlow 这是Firebug插件的一个扩展，优化的；
Firecookie也是Firebug插件的一个扩展，用来看cookie的；
Page Speed不错的HTML优化工具，google出品；
FireQuery 让当前页面加载jQuery；
Flashbug swf debug工具；
Firebug Autocompleter：命令行的自动提示插件

IE Tab 2

能在firefox下使用IE的内核查看网页，在在firefox下有问题的网页中使用还是挺不错的！！(用IE Tab 2代替原来的IE Tab了，国人做的一个增强版，不错！)

JSView

查看JS的使用情况，用了多少个JS一看就知道了，还是挺好用的，喜欢上这个了；（3.6版后作者没有更新了，这有个修改版的http://forums.mozillazine.org/viewtopic.php?f=48&t=1704235）

DownThemAll

firefox下挺不错的多线程下载插件，没有迅雷时就用这个。

DownloadStatusbar

用于代替firefox自身的下载工具；

Easy DragToGo

轻松使用拖曳手势打开标签页

Html Validator

HTML验证插件，可到http://users.skynet.be/mgueury/mozilla/download.html下载最新的版本

Pencil 用来制作GUI模型相当不错，小玩下呵呵~

Xmarks

在多台机器之间同步书签（伟大的GFW不让我用啊！）。现Xmarks支持使用自己的FTP服务器了，太开心了。