要当好JavaScript程序员:5个debug技巧
我一直使用printf调试程序,一般来说都是比较顺利,但有时候,你会发现需要更好的方法。下面几个JavaScript技巧相信你一定会觉得十分有用:
1. debugger;
我以前也说过,你可以在JavaScript代码中加入一句debugger;来手工造成一个断点效果。
需要带有条件的断点吗?你只需要用if语句包围它:
if (somethingHappens) {
debugger;
}
但要记住在程序发布前删掉它们。
2. 设置在DOM node发生变化时触发断点
有时候你会发现DOM不受你的控制,自己会发生一些奇怪的变化,让你很难找出问题的根源。
谷歌浏览器的开发工具里有一个超级好用的功能,专门可以对付这种情况,叫做“Break on…”,你在DOM节点上右键,就能看到这个菜单项。
断点的触发条件可以设置成这个节点被删除、节点的属性有任何变化,或它的某个子节点有变化发生。
3. Ajax 断点
XHR断点,或Ajax断点,就像它们的名字一样,可以让我们设置一个断点,在特点的Ajax调用发生时触发它们。
当你在调试Web应用的网络传输时,这一招非常的有效。
4. 移动设备模拟环境
谷歌浏览器里有一些非常有趣的模拟移动设备的工具,帮助我们调试程序在移动设备里的运行情况。
找到它的方法是:按F12,调出开发者工具,然后按ESC键(当前tab不能是Console),你就会看到第二层调试窗口出现,里面的Emulation标签页里有各种模拟设备可选。
当然,这不会就变成了真正的iPhone,只是模拟了iPhone的尺寸,触摸事件和浏览器User Agent值。
5. 使用Audits改进你的网站
YSlow是一个非常棒的工具。谷歌浏览器的开发者工具里也有一个非常类似的工具,叫Audits。
它可快速的审计你的网站,给你提出非常实际有效的优化你的网站的建议和方法。
PS:复制的别人的;
要当好JavaScript程序员:5个debug技巧的更多相关文章
- 如何成为一个伟大的 JavaScript 程序员
这篇文章主要概述在我5年工作经验的基础上,我成为优秀JavaScript开发人员所使用的技术和资源. 当前大多数Web开发人员面临着这样一个共同的问题:他们必须在多个不同的领域领先于他人——从数据库到 ...
- 为什么我要称自己为Javascript程序员
Aaron Griffin写了一篇精彩的牢骚文章,主要是关于各种框架和它们能把程序员从主要业务编程中抽离出来的功能特征.概括一下他的主要论点,当你成为了一个“Rails程序员”,你使用的是一种易于理解 ...
- 初中级Javascript程序员必修学习目录
很多人总感觉javascript无法入门,笔者在这里写一下自己的学习过程,以及个人认为的最佳看书过程,只要各位能按照本人所说步骤走下去,不用很长时间,坚持个3个月,你的js层级会提高一个档次,无他,唯 ...
- [JavaScript] 初中级Javascript程序员必修学习目录
很多人总感觉javascript无法入门,笔者在这里写一下自己的学习过程,以及个人认 为的最佳看书过程,只要各位能按照本人所说步骤走下去,不用很长时间,坚持 个3个月,你的js层级会提高一个档次,无他 ...
- 以技术面试官的经验分享毕业生和初级程序员通过面试的技巧(Java后端方向)
本来想分享毕业生和初级程序员如何进大公司的经验,但后来一想,人各有志,有程序员或许想进成长型或创业型公司或其它类型的公司,所以就干脆来分享些提升技能和通过面试的技巧,技巧我讲,公司你选,两厢便利. 毕 ...
- [转]成为优秀Java程序员的10大技巧
转自:http://www.codeceo.com/article/10-good-java-programmer-tips.html Java程序员有许多应遵循的守则或最佳实践方式.本文概述了每个开 ...
- 程序员作图工具和技巧,你 get 了么?
分享程序员常用的画图软件和小技巧 大家好,我是鱼皮. 说实话,我觉得做个程序员挺好的.日常工作有很多,写代码.对需求.写方案等等,但我最爱画图:流程图.架构图.交互图.功能模块图.UML 类图.部署图 ...
- JavaScript程序员必备的5个debug技巧
1. debugger:我以前也说过,你可以在JavaScript代码中加入一句debugger;来手工造成一个断点效果.需要带有条件的断点吗?你只需要用if语句包围它: if (somethingH ...
- 每个JavaScript程序员都需要知道的5个数组方法
Array.forEach() .forEach() 方法能够方便的让你 遍历数组里的每个元素,你可以在回调函数里对每个元素进行操作..forEach()方法没有返回值,你不需要在回调函数里写retu ...
随机推荐
- Fiddler的一些坑: !SecureClientPipeDirect failed: System.IO.IOException
手机的请求Fiddler可以捕捉,但是手机一直无法上网,在logs中看到的日志如下: !SecureClientPipeDirect failed: System.IO.IOException 由于远 ...
- UVALive 7138 The Matrix Revolutions(Matrix-Tree + 高斯消元)(2014 Asia Shanghai Regional Contest)
题目链接:https://icpcarchive.ecs.baylor.edu/index.php?option=com_onlinejudge&Itemid=8&category=6 ...
- TCL笔试题 将A,B,B,C,D,E,第三个字符不可以是E的所有组合输出;
思路:利用排列思想,进行递归:#include "iostream" using namespace std; ]; void pick_one(char a[],int num[ ...
- Android--RecyclerView的封装使用
1,用了很长一段时间的RecyclerView,在项目中用的频率也越来越频繁(因为踩得坑也越来越多了),或过头来看,感觉一直在写RecyclerView.Adapter中的三个方法和一个内部类,感觉很 ...
- HTML5探秘:用requestAnimationFrame优化Web动画
本文转载自: HTML5探秘:用requestAnimationFrame优化Web动画
- NDK开发历程(一):android native code的调试方法
引用:http://www.cnblogs.com/ychellboy/archive/2013/02/22/2922683.html 使用NDK在android上做开发是一件“痛并快乐着”的差事,之 ...
- 【002:ESP8266 移植 Mqtt 】
系统环境: ubuntu 16.04 64bitSDK版本: esp_iot_sdk_v1.3.0记录时间: 2016年10月13日联系方式: yexiaopeng1992@126.com 背景:在E ...
- UWP toast
Windows10的自适应和交互式toast通知是一个新特性.它可以让你: 创建灵活的toast通知,包括内嵌图片及更多的内容,不在局限于之前Windows 8.1和Windows Phone 8.1 ...
- Oracle表结构修改触发视图无法正常使用问题
一.问题描述 当对视图使用的基表进行表结构修改后,会触发视图的无效以及编译出错问题,必须重建视图解决. 二.问题再现 1.Oracle10g环境 1.1 创建视图测试用两张基表:TestTable和T ...
- AjaxUpload跨域上传问题
1. 调用上传的html页面所在域名是 www.abc.com ,添加document.domain <script> document.domain = "abc.com&qu ...