Javascript 小游戏，“是男人坚持 100 次”January 22, 2009

佛爷去了公司的年夜饭，我有点无聊就在公司 Coding 点东西玩玩，于是就有了这玩意。请允许我很猥·琐得将这个游戏称之为“是男人坚持 100 次”（坦白讲，我是死活玩不到这个级别了）。

原定两个小时搞定的脚本，结果花了我将近三个小时的时间。完事后我在 Twitter 上记录下心得结果被群殴（看来 Twitter 不能当作笔记本），还是记录到 Blog 里比较靠谱

1. 设计模式和算法很重要，在前期打“腹稿”的时候就应该搞定那玩意。
2. 按需加载，特别是在大量的 DOM 操作时，这时候就要体现算法的力量了。
3. 命名很重要，能避免很多问题。比如遇到了不大不小的 Bug，原因是我作孽得将某个变量命名为 “class” 了。
4. 效率优先是没有错，可怜我一开始就考虑这些而忽略了其他更重要的事情，绕了很多的弯路。
5. 结构尽量精炼，能用 CSS 实现的效果尽量用 CSS 实现。
6. 将“杂碎”的处理拉出来或者再细分整理下，不要写“一坨”很长的 function，自己看着都累。

对技术实现有兴趣的朋友可以看下核心的 Javascript 代码，欢迎提任何建议。PS，在内测的时，虽然这小游戏是我写的，但发现谁都比我玩得好，真是没有脸活了。

顺便八卦：Javascript 做游戏并不是不可能。从目前的情况以及效果和成本看，还是使用 Flash 比较得当。到 HTML5 以及 Canvas 普及以后，这情况可能会有所改变，不过在这之前谁又能等的了呢。

最后，游戏地址：

http://www.gracecode.com/demo/dazing/

您坚持了多少次？亮出来看看？

-- Split --

另，小虎 也写了个 Javascript 小游戏，我称之为“天上地下打不死”，有兴趣也可以看看。

全局空间的“污染”哲学January 21, 2009

八卦文章，所以标题党下，见笑。期前编写 JavaScript 框架的规则，玉伯在他的 Blog 已有提到。而今天看见 Ajaxian 上收集的目前主流 JavaScript 框架占用的全局空间变量数目，我也忍不住八卦下。

大家或许都知道，使用全局空间要格外的谨慎，如果滥用全局空间会造成诸多问题。随着 Javascript 的框架越来越多，不同的设计哲学相互碰撞，形成很有趣的局面：

其实，从上面几个图就能看出 Javascript 框架能分成几个流派，就我使用过的几个典型的框架，谈下我的看法：

YUI 看起来像是少林寺，代码调理清晰谨慎也非常容易阅读和理解，但略显庞大和臃肿。其使用全局空间的方式，也犹如少林寺规一样，不敢“越雷池”半步，如数绑定到了 YAHOO 上。

jQuery 犹如丐帮，使用面广、上手容易，但要学得“降龙十八掌”和“打狗棒”并非易事。对于全局空间的态度也虽谨慎（全部绑定到 jQuery），但大家似乎更习惯使用“$”，而忘记还有个 jQuery 变量。

Mootools/Prototype 很逍遥派，代码优雅高效，但真正理解的掌握需要有高深的内功。全局空间上使用也近乎随意，甚至对浏览器内置的功能也有不同程度的扩展。Mootools 的作者也讨论过相关的设计哲学，在这里就不复述。

另外还有个很有趣的现象，就是似乎大家都很喜欢使用美元符“$”变量。但这意味着如果载入不同的框架，就会造成命名空间的相互污染（详细）。

避免全局空间的污染，在一定程度上能避免以后自找麻烦，也更有利于代码的模块化。撇开上述框架的八卦，在编写实际代码时更应该注意全局空间的污染问题。

使用 toString 进行类型检测January 13, 2009

toString 方法返回对象的描述信息，很多时候我们都忘记了还有这属性的存在。在查看 jQuery 源码时，发现其 isArray 竟然令人惊艳的使用 toString 进行类型判断：

597 toString = Object.prototype.toString;
    ...
616 isArray: function(obj) {
617    return toString.call(obj) === "[object Array]";
618 }

Javascript 这种弱类型的脚本语言进行类型检测，是件很头痛的事情。巧合的是 Perfection Kills 近期也发布了篇同内容的文章，并得出相似的结论。

Perfection Kills 还阐述了使用 instanceof 和 typeof 需要格外注意的问题，以及其他如何使用“正统保险”的方法实现 isArray 函数（另，针对 YUI 的 isArray 写法，可以参考这里）。

回到上述 jQuery 代码，Mozilla 针对 toString 的描述道破其中玄机：

If this method is not overridden in a custom object, 
toString returns [object type], where *type* is the object type. 

那么，可以同时 toString 使用针对统一的返回格式进行类型检测。由于 call 的首个参数必须是 Object 类型以及

alert(typeof null);

返回的是 Object （标准如此规定让我很困惑），那么索性针对 undefined 以及 null 独立的判断。根据上述观点实现简单的检测代码如下

var chkType = function (obj) {
    if (obj === null) {
        return 'Null';
    }

    if (obj === undefined) {
        return 'Undefined';
    }

    return Object.prototype.toString.call(obj).match(/s(.+)]$/)[1];
};

最后，简单得写了个 DEMO。