zoukankan      html  css  js  c++  java
  • 巧用条件断点实现更好的调试

        条件断点,顾名思义就是在断点上加个条件语句,当语句为真时才触发断点。那我们可以在这个语句中加入一些逻辑来达到一些调试目的并通过设置返回值永远为false来让断点不会被触发从而影响调试过程。

       

       【不修改源码,来给代码加上console.log】

         代码: a.htm

    <html>

    <script src="a.js"></script>

    <body>

    asdf

    <div id="aa"></div>

    </body>

    </html>

     

           

              a.js

    setTimeout(function () {

        for(var i=0;i<1000;i++){

            document.getElementById("aa").innerHTML += i + "<br>";

        }

    },1000);

     

         那我想在a.js的循环体中加上console.log(i)。我们可以修改源码保存,浏览器Ctrl+F5,即可生效。

         但是:

           1)有时不止是保存刷新即可,比如部署至测试环境后,需要svn签入,服务器同步等时间

           2)调试结束后,源码中的调试代码可能会忘记删掉

     

         现在介绍另一种做法:

         1)浏览器(这里用chrome)开发者工具中,在循环体内打个断点

         2)断点上右键,点击Edit Breakpoint。在弹出的的输入框中写上console.log(i) 

         3) F5刷新,日志就出来了

     

         这么做的好处是:

         1)不污染源码

         2)快速

         3)不停的f5啥的也不会丢失这个条件断点

         这么做的不足是:

         1)源码中在断点位置之上添加行或删除行,浏览器中断点的位置仍保留在原来设置的行号上,就会错位

         2)源码中的console.log会在面板中显示来源位置,而通过条件断点加上的就没有(会显示来自VM),不过这个问题不大,可以从开发者工具的breakpoint栏中进行基本管理

     

         【在特定情况下打断点】

         在上面的例子中,我们希望i是100整数倍时打印出来,可以在条件断点中写:i%100==0 && console.log(i)

     

         【进行一些代码逻辑修改】

         在上面的例子中,我们希望i的步长变成2,可以在条件断点中写:!++i

  • 相关阅读:
    几行代码搞定图片模糊模式
    SVN源代码管理规范
    模仿苹果手机虚拟键的代码分享,有兴趣的可以玩玩。 下面的是链接,复制粘贴到浏览器就能下载
    keytool使用方法
    Unity导出APk出错解决方法二
    学习网址
    eclipse中手动设置library,选择编译工具方法
    apk接入google play邮箱登陆及充值注意事项
    unity导出apk错误出错解决方法
    java自动生成jar包工具
  • 原文地址:https://www.cnblogs.com/Omnia/p/5923156.html
Copyright © 2011-2022 走看看