善于从bug中分析问题也是一种能力

　　在前端开发中，出现一些bug不过是家常便饭。这些bug常常会使你焦头烂额，不知所措。至少在我的早期职业生涯中是这样。拿CSS来说，在FF下好好的样式，可到了IE就全乱了套。Js也有同样的问题，在FF中运行良好的代码，放在IE中运行就会提示你有错误发生。相信这类问题你一定遇到过，也深以为痛。但是，如果你弄清了这些问题的实质，你就会豁然开朗，你会突然发现一切尽在你的掌握之中。

　　好些时候，有朋友拿着在IE中乱套的页面向我求救。在看过他们的代码之后，我会告诉他们在代码的某一行加上zoom:1即可，在尝试着加上这个属性之后，问题迎刃而解。当他们下次拿着同样的问题(不过这次是以不同的方式呈现出来)再来求救的时候，我用的是相同的解决方案。曾经有个朋友，在页面布局时发现某个地方总是多一片空白，找了很久也没解决，他将链接地址发给我，我通过Firebug看了代码之后，告诉他问题的症结所在，并提出解决方案。当他想进一步了解为什么是这样的时候，我告诉他这是“块格式化上下文(Block formatting context)”和IE特有的hasLayout属性所致，并发给他相关的资源链接。开始的时候，我错误的以为这是IE中的bug，在充分了解“格式化上下文”和 IE的hasLayout属性之后，我明白了那些常见问题发生的根本原因。

　　同样，在js调试中我们也会遇到类似的问题。比如，在定义一个对象时，多出一个逗号(如var obj = {a:”bug”,b:”shit”,}或者var arr = [1,2,3,,])造成IE6/7/8不能正常运行。最恼火的时候，在你查遍所有代码，发现竟然是一个逗号造成的时候，你不免生出许多无奈。一个逗号，竟带来如此的差异，那么这个问题就值得细细思考一番。几番调试，你会发现数组多一个逗号在浏览器之间带来的差异，逗号位于数组的中间和位于数组的末尾产生的不同结果。当你查阅相关的资料，最终在ECMAScript 5 11.1.4中找到对数组中多余逗号的相关描述时，你就会彻底明白了问题发生的根本原因，你就会明白这不是一个bug：FF等高级浏览器按照规范来运行，只是IE浏览器到了IE9才真正实现它。

　　这两个我们常见的问题，尤其是第一个问题，我不想再本篇中对此做详尽的描述。关于此类问题的文章已有人做过分析，无须我再次添足。我要说的是，在前端开发中，当同样的问题多次出现的时候，学会分析，学会思考，学会总结，方能提高。唐代名医孙思邈有云：“上工治未病，中工治欲病，下工治已病”。问题出现，如果仅仅是为了解决问题而解决问题，那么我们就会永远停留在“治已病”的阶段，问题解决起来就相对棘手。倘若能从问题当中寻根问底，刨清实质，就会更进一步。一旦问题了然于胸，在开发的开始阶段就会避免问题的发生，或对问题的发生有一定的预见性。在这个时候，你就是“上工”——“是故圣人不治已病治未病，不治已乱治未乱，此之谓也。”

生活不易，码农辛苦
如果您觉得本网站对您的学习有所帮助,可以手机扫描二维码进行捐赠