非主流javascript教学（六）

呃， 这次我们提下jQuery

我们知道jQuery是javascript里面一个很优秀的家伙。

很多人甚至是为了jQuery而开始学习javascript的。

比如undefined同学。

 

=。=

然后某同事在用jQuery的时候出问题了。

 

呃， 出什么问题？

jQuery能出问题无非就这么几种：

1 jQuery有bug。

2 Ajax的问题（基本上可以认为jQuery有bug）

3 $符号的冲突问题。

 

大家都知道$符号冲突了， 调用noConflict就OK了呗。

其实不是这样的。

其实问题比这严重的多。

 

 比如我同事碰到这个， 他们在项目中使用了$， 大概就是这么定义的：

 

function $(id){
    return document.getElementById(id);
}

 

 

读过前面文章的人都知道， 这种写法是最糟糕的。

理由：

1 你丫的使用全局变量！

2 用全局变量我们也就认了，你丫的没有用匿名函数! 你应该var $ = function(){。。。。} 这样才对吗！！！

3 你丫的居然用这么不装13的写法， 你怎么好意思说自己会javascript啊！！！

 

当然了， 代码已经写好了， 也就没有去改的必要了。 

但是问题来了：

同事在项目二期的时候计划引入jQuery， 然后呢？ 大家可以猜到， 一定会用noConflict了吧？一定可以完美解决了吧？错！

首先是， 两个js谁放前面？

 

大家说， 那还用问， 当然是jQuery放前面， 类库放前面吗， 自己的代码放后面吗， 国际惯例。

so， 问题来了：

那么jQuery岂不是被我们的$给覆盖了吗？

错！没有覆盖。 这个问题就蛋疼了。 说起来也挺麻烦恶心的。 反正， 如果他的定义是这样的：

 

window.$ = function(id){
    return document.getElementById(id);
}

 

 就是我们提倡的装13的写法， 这样就不会出问题~

这个不管了。 现在， 反正$冲突了， 总该让noConflict出场了吧？

又错了。。。

我们用noConflict的时候一定要知道为什么noConflict可以解决冲突。

 

jQuery在加载的时候， 备份了一次$， 然后如果你调用noConflict， 那么jQuery会将备份的值给还原回去。

好， 问题来了。

我们看下：

1 最初， $没有定义。 那么$===undefined

2 jQuery加载。 他备份了$， 然后定义$ 所以备份的是undefined， 

3 加载同事的代码。  由于一个诡异的问题， $冲突了。

4 这个时候试图用noConflict来解决冲突(当然这个思路是完全错误的。 暂时不去责备他)。

5 undefined被还原。

 

怎么怎么， 怎么回事？undefined你咋这么喜欢凑热闹， 到处都有你啊？

 

=。=

不好意思， 事情已经发生。 请寻找解决方案， 而不是一味的去责备谁。

那么， 解决方案是什么呢？

其实根本不需要noConflict这么麻烦， 我们的代码在jQuery之后加载， 我们覆盖它不就行了吗？

 

代码：就用刚刚我们说的装13写法。

$变量轻松的被覆盖掉了。 

而使用jQuery的办法则是大家熟知的：

(function($, undefined){
    //自己的代码在这里
})(jQuery);

 

 搞定。 装13写法再次战胜其他语言中的常规写法。。。。