生活参数

血色浪漫

Shawn — Wed, 18 May 2011 00:31:15 +0800

脚步匆匆，晃眼又过了好久。有朋友的离开，有旧友的相聚。闷头工作好久之后突然有牵涉悲欢的离别重逢之事发生，生活突然鲜活了过来。

起初，鸽子离职，挺难过。那天，默默喝了不少酒，还偷偷抹了把眼泪。

后来，来到青岛，在熟悉的路上走走，在熟悉的球场打球，在熟悉的餐厅吃饭，回来走一遭，会会好朋友，感觉非常好。工作后怕没有几人能像学生时代那样开怀畅饮，即便只隔着一年。酒桌之上发现已经没有以前的肚量，几口下去已无法喝下。我非常高兴，第二天一起去打cs，水平烂但心情不赖。

再后来，独自去了桂林阳朔。骑车在群山中狂飙，一个人躺在竹筏上漂流。看客觉得无趣，谁知我内心近似疯狂的欣喜，无他，沉醉尔。阳朔的山水让我印象深刻，后来看了《印象刘三姐》，不说其他，自此我打算把《印象》系列都给看了。等了3天终于凑到人去徒步，沿着漓江7小时的路程，山水风光，一草一木美极。同行的echo竟和我有好多相似之处，恰遇知音更趋完美。

最后，回到工作的杭州。踏入城市的时候突然很想折返。大事未成，不敢过多流连忘返啊。

这一生会遇到那么多人，会做那么多事，最后能记得的有几人几事。路上那么多人跟我聊起理想，又看现实中那么多人结婚生子买车买房，路的方向被生活挤压，向自己低头。这是你我要的路吗？“在路上”的感觉永远那么珍贵，追理想，拿结果，更要这华丽的过程。

再看一遍《血色浪漫》，继续来过，从头来过，无论如何自由的过。

发烧来着，说胡话了。

JS代码的可维护性

Shawn — Sat, 22 Jan 2011 14:25:53 +0800

最近在研究Google Closure Compiler，顺带看了不少Closure Library的代码。一边瞄Google的Js代码组织方式，一遍惊叹于Google在代码可维护性上下的功夫。Library里那么多代码，在Google JavaScript Style Guide的指导下风格一致，看起来毫不费力。特别值得一提的是，注释详细给力，数量远超代码行数。

风格统一、注释详细、容易阅读的代码意味着缩减大型团队巨大的沟通开销，开发者可以很容易对代码做出贡献，以及良好的可维护性带来的维护成本降低。作为JS开发者，日常开发中，如果你觉得很多时候都在纠结如何从众多实现方法中挑选出一种来实现一个功能，这说明有些地方出问题了。我认为，简单的实现，容易阅读的实现，易于维护的实现应该收到重视。JS作为一种动态函数式语言有高度的灵活性，这导致对于一个功能往往存在n多种不同的代码书写方式。是不是经常看不懂别人写的代码？是不是经常看不懂自己以前写的代码？其实，为了节省几个字节、一点点运算，甚至为了仅仅为了更酷一点而把代码组织的晦涩难懂，是非常得不偿失的。

团队开发中会发现，对于一个逻辑稍微复杂的产品，往往花在上面的时间，绝不仅仅是第一次实现它的时间。由于产品的更新换代，设计师的交互方式改动、业务方的业务逻辑变更势必带来代码的再次维护。然而在实际工作中，一个人往往参与多线操作，下次维护这个产品之前可能要经历其他几个产品的开发，那么你怎么保证能够在再次维护它时能够快速而精准的修改代码？况且，下一次负责代码维护的人可能根本就不是代码的作者，你的代码绝技可能会秒杀队友。在前端，问题很严重。

我想，可维护性，这是解决很多现有问题的关键字。

那么，如何去做：

1. 统一简单的代码风格。这里有两个关键字，统一和简单。你不是一个人在战斗，我们都在“云战斗”，代码不仅要自己看得懂，队友也要看得懂，所以势必要统一风格。而且代码风格要简单化，有两个好处：第一，新人加入比较容易，学习代价小，容易普及；第二，开发者可以将大部分精力focus在功能逻辑设计上面，而不用再整天纠结怎么写代码。这些，都是成本，降低成本才能利益最大化。

2. 设计先行。开发者倾向于为了快速实现，匆匆码代码，功能差不多了，再修修补补，最后产出一陀自己都不想再看一眼的代码。其实在软件设计领域，早就有很多指导程序设计的思想、相应的方法论和配套的工具，前端开发者作为迟到的一群人却鲜有人愿意拿起这些武器。

对于简单页面的实现，极少的功能你可以随随便便写几行交差，没问题。但是对于复杂逻辑的、可以提高到应用级别的产品，往往需要后续大量维护，你再这么干就不太好了。比较流行的设计思想当属面向对象的设计，先设计一下你的数据模型，类结构组织等，能让最后产出的代码质量显著提高。虽然近几年也有去面向对象设计的思想出现，但是它还是很能解决问题的。所以我也没有觉得，一定要用面向对象的设计，如果其他的设计理念方法论可以很好的适应前端开发，当然是可以的。但是，设计要先于编码。而且，设计产出的文档是以后代码维护的重要依据。

3. 详细的注释和文档。这个是可维护性的重要因素，缺之不可。

最近在上面三个方面都尝试了些，说一些收获。

1. 代码风格推荐Google的方式，目前应该是最完善的，而且风格很简单。可以移步Google JavaScript Style Guide查看。代码风格的细节不是那么重要，只要能够达成共识，细节不必要太扣的。

2. 前一段时间对公司内部一个项目以面向对象的方式重构了一次代码，收效非常好。当然这种程度远远不够，最近在看《Practical Object-Oriented Design with UML》，收获颇多，打算在前端种尝试一下UML。还有在组件开发中尝试运用FSM（有限状态机），让组件更加健壮。记得有一次跟周爱民老师一起吃饭，周老师说可能在前端引入建模这些重型的思想不容易被接受，可能如此，倒也值得一试。我的想法是，最好的情况是把这些方法论能够实质化为工具，接下来会继续尝试。

3. 注释其实就是文档的一部分。在js开发中，使用jsdoc可以把代码中的注释转化为文档。这里值得一提的是，Google的Closure Compiler使用注释中的annotation提供强类型检测，可以有效提高代码质量。昨天刚翻译了一篇文章，可能会有所帮助——怎样为cc编写注解。

关于Google Closure，推荐一本书《Closure: The Definite Guide》，可以发 email向我索取。

inline-block总结

Shawn — Sun, 12 Sep 2010 17:19:33 +0800

前几天做东西的时候遇到由于hasLayout引起的bug，google的时候搜到这篇IE7-/Win: inline-block and hasLayout，简单总结了下。

在现代浏览器中inline-block behavior都可以方便的通过display:inline-block来触发，但是（恨！），在IE 7-（IE7及以下版本）中，display:inline-block却未必能触发inline-block行为。

友情提示，以下说的是IE 7－

1. 对于内联元素，比如<span><a><textarea><input>等：

a. “display:inline-block;”可以触发inline-block behavior

b. “zoom:1;height:0;”可以触发inline-block behavior

在这里a和b两种方法都可以使元素获得hasLayout属性，故此，对于内联元素只要使其获得hasLayout属性就可以触发inline-block behavior。

2. 对于块级元素，比如<div><h1><p><li><ul><ol><li>等：

a. “display:inline-block;”不可以触发inline-block behavior

b. “zoom:1;height:0;”不可以触发inline-block behavior

c. “zoom:1;height:0;display:inline;”可以触发inline-block behavior

在这里可以看出通过添加hasLayout属性不可以使块级元素触发inline-block behavior，但是当加上display:inline之后就可以触发了。甚至还存在一种看起来恨诡异的方法：

d. 在两个选择器中按顺序分别定义“display:inline-block;”和”display:inline;”可以触发inline-block behavior。比如（必须按照这个顺序才可以，也不可以写在同一个选择器中，即使同一个选择器也要写两次）

div.test { display: inline-block; }

div.test { display: inline; }

综上，在IE 7-中，inline-block的触发条件是：拥有hasLayout属性的内联元素。

也就是说对于内联元素，只要让其获得hasLayout属性便可以触发；对于块级元素来说，需要先将其转化为内联元素，再加上hasLayout属性，这样才可以触发inline-block behavior。

那么，我们写一个通用类，实现兼容所有浏览器（包括IE和非IE现代浏览器），且在内联元素和块级元素上都可以触发inline-block行为：

.inlineBlock {
    display:inline-block;
    *display:inline;
    *zoom:1;
    *height:0;
}

注意第1行和2行是不能调转顺序滴:-)

—————–传说中华丽丽的分割线——————
ps:最近好衰，记得某晚我用windows live writer写的这篇文章，但是writer的突然crash让我今天重新写了一遍……

从毕业到现在

Shawn — Sat, 31 Jul 2010 16:17:32 +0800

好久没有更新，今天得这个空闲时间来说说最近的生活。

记得六月份为毕业设计的种种奔波，为得不到老师的支持而不爽，像我当时想的那样，终究顺利的结束。在学校的忙碌，现在想来都变成了美好的回忆。记得大家为dota大喊大叫，记得我搬着笔记本楼上楼下，大家都知道那是最后的疯狂，玩的很开心，很激情。到最后的时候，我是很不舍得走，却因为一直不喜欢太过无聊的生活，在犹犹豫豫中竟然想早点结束最后的疯狂，我当然知道离开了会想念。看着校园的风景，眼睛总有些朦朦胧胧，每次经过某个学院的毕业晚会，总是不敢看太多。我们计通的晚会变成了恶搞晚会，笑料不断，有点失望，但却也懂得这是一群技术男表达出的另外一种寂寞。

终于走的时候，看着兄弟们，还是没有忍住，抱着兄弟们大哭。唉，该来的还是来了。在去机场的路上，心中久久不能平静。四年的画面快速的滑过，充满了感动。离开了青岛可以回来，离开了兄弟呢？还可以回来一起豪饮，一起dota，一起打球吗？也许在以后的某个时刻，路过某个城市，有个兄弟可以和我畅怀豪饮，我们一起聊聊过去和未来。

后来，来了杭州。在公司一直培训，事情不是很多，但也没有多少空闲时间。公司里的气氛很好，大家放的很开，玩笑很多，整人比较狠……租了房子，过着典型上班族的生活，忙忙碌碌。我正在尝试找到这里的激情，努力工作，用心学习。环境很适应，像我这种人，到哪里感觉还真都一样。

昨天看了下同事的作品，有点羞愧难当，要努力进步一下了。祝我的朋友们事业有成，天天快乐！真诚的。

法国见闻（二）

Shawn — Sat, 24 Apr 2010 21:58:44 +0800

在法国的最后一站在巴黎。

在巴黎我们5个人蜗居在一个小小的房间里，房东是一个中国年轻人。他在巴黎租别人的房子给我们这样的过客赚钱。在这个小小的房间里我们吃到了中国菜，甚至米饭拌上酱油都是那么美味。

巴黎这个举世闻名的大都市却并没有大厦林立的光鲜外表，她有的是保存完整的各种古建筑。我也不懂这些建筑风格，只是觉得挺有味道。道路狭窄，小巷中鳞次栉比的酒吧，古旧甚至破旧的道路，破烂拥挤的地铁，是这个城市的外在。法国人在街头喝咖啡和酒，在卢森堡公园的躺椅上晒太阳，街头艺人的各种表演，让来自拥挤的东方的我感觉到了另外一种悠闲，透着一丝慵懒。

巴黎是艺术之都。我了解的不多，只是去了比较出名的卢浮宫和蓬皮杜。类似国内的故宫和798工厂。我见到了向往已久的维纳斯，非常高兴。在蓬皮杜刚开始我们误入了顶层的一个餐厅，玻璃天花板透进来的充足阳光和桌子上放满的玫瑰花，使这里更像一个艺术展厅，或者让我们这些过客坐下来静静领悟艺术的地方。餐厅里一位漂亮的美丽女生，一直用英语对我们说：“I’m sorry, but this is a private place. I have told you one, two , three.. times. Please…”She is a pretty girl, actually.

巴黎圣母院相比其他教堂拥挤不堪，但是我有幸见到了弥撒的全过程。听神父法语的呓语说教，静下心来仿佛也纯洁了一瞬间，抛弃了身旁的喧嚣。巴黎圣母院更像一个建筑的艺术品, fantastic。

对了，到达巴黎的第一站是夜游塞纳河，旁边就是埃菲尔铁塔。有水的地方似乎都人杰地灵，这个地方的夜晚美的一塌糊涂。冷风吹来，乘船欣赏夜色，旁边虽然喧嚣，心中却很静谧。波光粼粼的河面洗涤着燥热的灵魂。

白天的时候我们登上了埃菲尔铁塔，发现刚出火车站看见的那个高楼竟然是视野中最高的楼。其他的都是不太高的欧式建筑，风格优雅。在塔顶上看见了上面标注铁塔离世界各地城市的距离，离家这么远了啊。

巴黎的十三区是中国人的聚居地，乘兴而去，败兴而归。本来以为会很热闹，虽然建筑风格是很中式的（四四方方的大楼），但是回家的感觉没有找到。可能我没找对地方吧。

法国之行结束。希望将来可以故地重游。

在巴黎存着一丝侥幸，能不能碰见张曼玉。看样子她回国拍电影去了……

发放奇艺网邀请码

Shawn — Mon, 19 Apr 2010 19:08:41 +0800

奇艺网是百度旗下视频网站，现在发放邀请码，有需要的留下邮箱。

额…空间访问量太小，希望有人看到吧。

法国见闻（一）

Shawn — Sun, 21 Mar 2010 06:56:57 +0800

从大年初二出发到现在，在法国的行程已近尾声。在Brest最后的一个周末，记录下来此行的流水账。

大年初二乘坐法航的飞机抵达巴黎戴高乐机场，没有想象中的兴奋。然后紧接着转机来到了此行的目的地布雷斯特市。出机场拿行李的时候，我的行李箱出的特别晚，刚开始还以为转机弄丢了，虚惊一场。出了机场后，学校的联系人Hondy紧接着出现，驱车把我们送到了学校。行程顺利。

不得不提的是，来这儿的第一印象就是风景好，环境好，空气质量很高。我们都笑称，这儿的云彩相比国内的技术好，3d的。

学校的名字叫ensieta。每人一个单间宿舍的礼遇让我们住习惯了六人宿舍的人感到很高兴。开始的几天沉浸在时差的痛苦中，每天醒的特别早，白天却困的要死。抵达的第二天上午，Hondy带我们见了学校的老师，我们几个人基本上由Bruno和Michel两个老师带。Bruno是个和蔼热心的老头，Michel则是一个很有活力的年轻人，伴有浓重的狐臭味。

接下来在两个老师的指导下选课题。此时发现交流十分困难，法国人浓重的法式英语非常难以听懂。我们四个计算机相关的同学分成两组，分别选了两个题目。第一个题目，是在flightgear这个飞行模拟软件上做2次开发，给摇杆控制增加网络功能，即不是把摇杆直接连在装有flightgear的电脑上，而是连接到另外一台电脑上，通过socket连接，控制飞行状态。第二个题目是做一个web service，用来提供HTTP方式访问埋在海里的一个温度传感器。我的题目是第一个。

法国人很讲礼貌，早上见了面要握手打招呼，亲近的人要贴面。每个时段有不同的打招呼，周五的时候会说周末愉快，相比来说，国内随便的多。我们也入乡随俗，学会了简单的几句法语（你好，谢谢，不客气…），凭借这些顽强的活了下来。

传说中法国也是一个美食王国，我们却没有品尝出特别的美味，但是我们每顿在餐厅里吃的很饱。因为我们的餐卡在餐厅里是可以无限刷的，每顿饭至少在数量上可以说的上是大餐。我想，回国后我唯一会想念的是这里的法式面包：坚硬无比，身长数丈，抹上黄油后味道非常美味。他们的蔬菜一般不会烹饪，只是生吃，而且味道非常奇怪。切开流出半盘血、吃到嘴里嚼不烂的牛排也让我印象深刻。

第一周新鲜的生活很快就过去了，迎来的是漫长的煎熬。flightgear的文档很少，编译源代码也耗费了大量时间，很是煎熬。下午结束后也没有地方可以去，因为学校在郊区，座公交去市中心就没有回学校的车了。平时街上很少人，周末的时候市中心才会多些人，周日所有商店关门，非常奇怪。

第一个周末去市中心逛街，拍拍照，一个国内过来的留学生带我们转了转，买了手机卡。去过市中心泡酒吧，感受了一下法国人的气氛。

后来，又一起去了海盗城Saint-Malo（圣马洛）。欧洲的高速火车让我有点晕车。漂亮的老城区很有feel，在城墙上望向大海，是一种美妙的享受。

上周末来到了天主教第三大圣地圣米歇尔山。说实话，这山很小很小，但是建筑很有特色，山上有教堂，教堂顶峰有一个屠龙金色雕像。在这里，我感觉百分之五十的游客是日本人，黄皮肤并不必白皮肤少。圣山在外面看才完美，夜景更加漂亮。晚上在山上的酒吧里遇见了一个泰安的女孩，嫁给了法国人，酒吧是她公公婆婆开的，还请我们喝了一杯啤酒。走在圣山和小镇的夜路上，没有路灯一片漆黑，我们大声唱歌，度过了一个难忘的夜晚。

现在，项目已经完工，已经可以成功的通过joystick驾驶飞机。下周要做的就是写写报告，给教授们汇报一下就结束了。26号将会离开布雷斯特，剩下的时间留给巴黎。

早起的鸟儿有虫吃

Tue, 22 Dec 2009 21:10:01 +0800

今天起的特别早，六点半的阳光有点稀疏，心情很好。很久没有早起了，早起的感觉不是一般的好啊。上班之后早起早睡感觉很充实，心情也好。我便去晨跑，想起很久没有去过的海边，决定往南跑，不幸的是由于甲流南门已经封了好久，这才想起原来我已经很久没有去过南门了。不过不影响，我就绕着南门的水泥马路跑了几圈。脂肪在燃烧，激情也在燃烧。

刚刚开始的工作很让我兴奋，身边的人都比我厉害，让我有很大的动力。跃跃欲试的心情加上还不足以胜任的现实让情况有点尴尬，但是我知道这是需要过程的，要一步一步前进。身边的同事很好，大家忙碌着，让我想说年轻真好。最担心的是效率问题，想了一天。本来打算快速的做头儿交给我的任务，奈何机器出问题下午的时间全部浪费在装系统上了。身边同事的忙碌，让我很是羞愧，我要加快速度！所以我咨询了下同事效率的问题，发现我的效率的确有点低，要加油。

对于团队的理解，我觉得我们地图团队非常好，非常非常的好。年轻，朝气，友好，我喜欢。不幸的是，由于我日况愈下的记忆力，还没有记清楚可爱的同事们的名字！不是我太沉闷，是我还没有记清楚大家的名字；不是我太孤僻，是因为我不是自来熟。我先老实地待着，慢慢的跟大家熟悉吧。我唯一要做的是不断的努力努力再努力！fighting！

踏上崭新的征程！

Learning curve Of Vim and even our life

Shawn — Wed, 25 Nov 2009 20:58:20 +0800

今天看到了一个很好的ppt，ppt里面有上面这一副很好的图，让我很有共鸣。

太多人在曲折的学习曲线下倒下了，不仅是VIM这样一个工具，更加是人生中无数个大大小小的“坎儿”。记得马云说过，要拥抱变化。在不断变化的环境面前，很多人犹豫了，很多人后退了，又有几个人去改变了。如果让你改变一个长久以来写x的方式你需要多久？

改变真的很简单，只要你不要想的太难。当你成功的改变，不断的改变，爱上改变时，你才会发现你的实力增长了，“腰不酸了，腿不痛了，爬山都有劲儿了”……学习VIM吧，同志们，尽管看起来有点复杂，但是它真的很值得你去花时间去掌握它。

分享一个本文开始提到的ppt，我用google docs分享了，请点这里。

Javascript的函数式语言特性

Wed, 18 Nov 2009 19:06:00 +0800

1930年前后，四位著名的人物——阿兰·图灵、约翰·冯·诺依曼、库尔德·歌德尔和阿隆左·丘奇展开了对形式化运算系统的研究。他们力图通过所谓的“形式系统“，来证明一个重要的命题：可以用简单的数学法则表达现实系统。1936年，图灵提出了”图灵机“的形式系统，冯·诺依曼提出了EDVAC体系设计，以及其上的编码程序、纸带存储与输入，完全实现了图灵的科学预见与构思。我们通常所使用的编程环境便是架构与这一体系之上。图灵机运算系统的本质是：通过修改内存来反映运算的结果。所有我们目前大部分编程都是通过围绕数据结构设计算法，进行运算。

四位先驱之一的阿隆左·丘奇的研究成果是一种称为Lambda演算的形式系统。这个系统的本质上就是一种虚拟的机器的编程语言——而不是虚拟的机器，它的基础是一些以函数为参数和返回值的函数。函数式语言是一种集中的体现。

我们来看几个例子：

//javascript代码

v = (bTrue ? 3+4 : 3*4);

使用函数来消减一次传递参数：

//javascript代码

function f_add(x,y) {

return x+y;

}

function f_mul(x,y) {

return x*y;

}

v=(bTure ? f_add : f_mul)(3,4);

在这里，+和*就相当与f_add和f_mul这两个函数，除开赋值运算符之外的“求值表达式”部分，我们可以把代码改写成：（注意以下代码并不能运行）

(bTrue ? “+”: ”*”)(3,4);

当运算符等义于某个（lambda）函数时，就可以称得上是一种函数式语言了。

函数式语言的特性集：

在函数外消除语句，只使用表达式和函数，通过连续求值来组织代码
在值的概念上，函数可以作为运算元参与表达式运算
在逻辑概念上，函数等义于表达式运算符，其参数是运算元，返回运算结果
函数严格强调无副作用

Javascript的函数便可以作为运算元，函数可以代替运算符，既可以作为数据值存储与向函数传入传出，又可以作为函数来执行调用。从另一个角度——“函数/表达式运算的效果”来看，这一切就变成了“所有的东西都是值”。因为函数是值，所有函数可以被作为值来存储到变量，也可以声明它的直接量；可以直接参与表达式的运算；可以作为其他函数的参数传入，或者作为结果值传出。

一言以概之，函数是第一型（fist-class data types）。更加直观的说，它表现为如下特性：

能够表达为匿名的直接量
能被变量存储
能被其他数据结构存储
有独立而确定的名称（如语法关键字）
可（与其他数据实体）比较
可作为例程参数传递
可作为函数结果值返回
在运行期可创建
能够以序列化的形式表达
可（以自然语言的形式）读的
能在分布的或运行中的进程中传递与存储
……

所有这些特性的要点在于：关注运算，以及运算之间的关系。

Javascript并不是纯粹的一种函数式语言泛型，它还具有其他语言特征，是一种动态函数式语言。它具有很高的灵活性，以至于使它成为一种“易学难精”的语言。

注：以上观点出自《动态函数式语言精髓》，暨《Javascript语言精髓与变成实践》精简版。由InfoQ免费发放。我对Javascirpt的了解并不深入，读此书也是懵懂。所以为防止表达与真相相差太远，很多观点仍是引用原文。虽然可能了解这些对于实际的动手操作并没有立竿见影的帮助效果，但是了解语言本身的特性以及设计思想会对以后逐渐深入的学习有莫大帮助。