善于从bug中分析问题也是一种能力
创始人
2024-07-30 00:51:15
0

前端开发中,出现一些bug不过是家常便饭。这些bug常常会使你焦头烂额,不知所措。至少在我的早期职业生涯中是这样。拿CSS来说,在FF下好好的样式,可到了IE就全乱了套。

Js也有同样的问题,在FF中运行良好的代码,放在IE中运行就会提示你有错误发生。相信这类问题你一定遇到过,也深以为痛。但是,如果你弄清了这些问题的实质,你就会豁然开朗,你会突然发现一切尽在你的掌握之中。

好些时候,有朋友拿着在IE中乱套的页面向我求救。在看过他们的代码之后,我会告诉他们在代码的某一行加上zoom:1即可,在尝试着加上这个属性之后,问题迎刃而解。当他们下次拿着同样的问题(不过这次是以不同的方式呈现出来)再来求救的时候,我用的是相同的解决方案。

曾经有个朋友,在页面布局时发现某个地方总是多一片空白,找了很久也没解决,他将链接地址发给我,我通过Fiebug看了代码之后,告诉他问题的症结所在,并提出解决方案。当他想进一步了解为什么是这样的时候,我告诉他这是“块格式化上下文(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才真正实现它。

这两个我们常见的问题,尤其是***个问题,我不想再本篇中对此做详尽的描述。关于此类问题的文章已有人做过分析,无须我再次添足。

我要说的是,在前端开发中,当同样的问题多次出现的时候,学会分析,学会思考,学会总结,方能提高。唐代名医孙思邈有云:“上工治未病,中工治欲病,下工治已病”。问题出现,如果仅仅是为了解决问题而解决问题,那么我们就会永远停留在“治已病”的阶段,问题解决起来就相对棘手。

倘若能从问题当中寻根问底,刨清实质,就会更进一步。一旦问题了然于胸,在开发的开始阶段就会避免问题的发生,或对问题的发生有一定的预见性。在这个时候,你就是“上工”——“是故圣人不治已病治未病,不治已乱治未乱,此之谓也。”

【编辑推荐】

  1. 前端开发与网页制作 一直被混淆从未被厘清
  2. 网站加速 美工和前端开发人员也很关键
  3. 百度JavaScript项目tangram开源 促进国内前端开发水平提升
  4. 编写高质量代码:Web前端开发修炼之道
  5. 1.2.4 前端开发人员如何自身定位

相关内容

热门资讯

如何允许远程连接到MySQL数... [[277004]]【51CTO.com快译】默认情况下,MySQL服务器仅侦听来自localhos...
如何利用交换机和端口设置来管理... 在网络管理中,总是有些人让管理员头疼。下面我们就将介绍一下一个网管员利用交换机以及端口设置等来进行D...
施耐德电气数据中心整体解决方案... 近日,全球能效管理专家施耐德电气正式启动大型体验活动“能效中国行——2012卡车巡展”,作为该活动的...
Windows恶意软件20年“... 在Windows的早期年代,病毒游走于系统之间,偶尔删除文件(但被删除的文件几乎都是可恢复的),并弹...
20个非常棒的扁平设计免费资源 Apple设备的平面图标PSD免费平板UI 平板UI套件24平图标Freen平板UI套件PSD径向平...
德国电信门户网站可实时显示全球... 德国电信周三推出一个门户网站,直观地实时提供其安装在全球各地的传感器网络检测到的网络攻击状况。该网站...
为啥国人偏爱 Mybatis,... 关于 SQL 和 ORM 的争论,永远都不会终止,我也一直在思考这个问题。昨天又跟群里的小伙伴进行...
《非诚勿扰》红人闫凤娇被曝厕所... 【51CTO.com 综合消息360安全专家提醒说,“闫凤娇”、“非诚勿扰”已经被黑客盯上成为了“木...