js调试工具Console命令详解

1、显示信息的命令

console.log('hello');
console.info('信息');
console.error('错误');
console.warn('警告');

最常用的就是console.log( )

2、占位符

console也支持printf的占位符,支持的字符有:
字符(%s)、整数(%d或%i)、浮点数(%f)和对象(%o).
console.log("%d年%d月%d日",2017,11,9);

3、信息分组

图片.png

图片.png

4、查看对象信息

图片.png
图片.png

5、显示某个节点的内容

图片.png

图片.png

6、输出表格

var animals = [{
        animal: 'Horse',
        name: 'Henry',
        age: 43
    }, {
        animal: 'Dog',
        name: 'Fred',
        age: 13
    }, {
        animal: 'Cat',
        name: 'Frodo',
        age: 18
    }]

结果:

图片.png

七、追踪函数的调用轨迹。

<script type="text/javascript">
/*函数是如何被调用的,在其中加入console.trace()方法就可以了*/
  function add(a,b){
console.trace();
    return a+b;
  }
  var x = add3(1,1);
  function add3(a,b){return add2(a,b);}
  function add2(a,b){return add1(a,b);}
  function add1(a,b){return add(a,b);}
</script>

八、计时功能

console.time('Timer1');
    var items = [];
    for (var i = 0; i < 100000; i++) { items.push({ index: i }); }
    console.timeEnd('Timer1');

结果:

图片.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Firebug控制台详解 Firebug是网页开发的利器,能够极大地提升工作效率。 但是,它不太容易上手。我曾经翻...
    meng_philip123阅读 464评论 0 5
  • 首先说明,讲解console的文章也有很多,这里只是自己认为的综合下而已,内容都是借鉴别人文章。参考文章会在文...
    avery1阅读 814评论 0 19
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,256评论 19 139
  • 对于js的调试,一般我们经常用alert()或者console.log()进行调试。但是alert()会让程序中断...
    猪猪侠闯天下阅读 847评论 0 0
  • 1.1 概述 调试程序,显示网页代码运行时的错误信息 提供了一个命令行接口,用来与网页代码互动 运行JavaScr...
    林立镇阅读 2,603评论 0 1