一、显示信息的方法

最常用的console.log(),一般用来调试。

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

效果:

二、占位符

console上述的集中度支持printf的占位符格式,支持的占位符有:字符(%s)、整数(%d或%i)、浮点数(%f)和对象(%o

console.log("%d年%d月%d日",2011,3,26);

效果:

三、信息分组

console.group("第一组信息");
console.log("第一组第一条");
console.log("第一组第二条");
console.groupEnd();
console.group("第二组信息");
console.log("第二组第一条");
console.log("第二组第二条");
console.groupEnd();

效果:

四、查看对象的信息

var obj = {
name: 'ali',
age: '20',
showName: function () {
alert(this.name);
}
}
console.dir(obj);

效果:

五、显示某个节点的内容

var info = document.getElementById('info');
console.dirxml(info);

效果:

六、判断变量是否是真

var result = 1;
   console.assert( result );
   var year = 2014;
   console.assert(year == 2018 );

效果:

七、追踪函数的调用轨迹

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);}

效果:

八、计时功能

console.time("控制台计时器一");
for(var i=0;i<1000;i++){
  for(var j=0;j<1000;j++){}
}
console.timeEnd("控制台计时器一");

效果:

九、的性能分析

function All(){
alert(11);
  for(var i=0;i<10;i++){
funcA(1000);
}
   funcB(10000);
}
function funcA(count){
  for(var i=0;i<count;i++){}
}
function funcB(count){
  for(var i=0;i<count;i++){}
}
console.profile('性能分析器');
All();
console.profileEnd();

效果:

chrome貌似不起作用,盗了一张firebug的图...

js调试工具console方法详解的更多相关文章

  1. js调试工具Console命令详解

    这篇文章主要介绍了js调试工具Console命令详解,需要的朋友可以参考下   一.显示信息的命令 复制代码 代码如下: < !DOCTYPE html> < html> &l ...

  2. js调试工具Console命令详解——转

    一.显示信息的命令 <!DOCTYPE html> <html> <head> <title>常用console命令</title> < ...

  3. Js apply call方法详解

    Js apply方法详解 我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这 ...

  4. JS之console.log详解以及兄弟姐们邻居方法扩展

    console.log() 基本用法 console.log,前端常用它来调试分析代码,你可以在任何的js代码中调用console.log(),然后你就可以在浏览器控制台看到你刚才打印的常量,变量,数 ...

  5. JS进阶篇--JS数组reduce()方法详解及高级技巧

    基本概念 reduce() 方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值. reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被 ...

  6. JS数组reduce()方法详解及高级技巧

    1.语法 arr.reduce(callback,[initialValue]) reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上 ...

  7. Js apply call方法详解【转】

    我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家 ...

  8. js cookie使用方法详解

    代码如下 复制代码 <script>function getCookie(c_name){ if (document.cookie.length>0){ //先查询cookie是否为 ...

  9. js数组sort方法详解

    在处理数组的时候,我们有时候需要对数组进行排序,排序的方法有很多种,但是最好最快的就是利用sort方法进行快速的排序. 我们来看一个例子: var arr1 = [6, 3, 4, 1, 2, 5, ...

随机推荐

  1. python基础day4

    1.列表生成式,迭代器&生成器 列表生成式 将列表[0,1,2,3,4,5,6,7,8]中的每个值加1,如何实现?常用的几种方法 方法一: a=[0,1,2,3,4,5,6,7,8] for ...

  2. hibernate对象关系映射的配置

    一对一主键关联单双向 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE hibernate-m ...

  3. Xamarin中VS无法连接Mac系统的解决办法

    Xamarin中VS无法连接Mac系统的解决办法 按照以下步骤排查:(1)确认Mac系统中安装Xamarin.iOS开发必备的组件,如Mono.Xamarin.iOS.(2)将Windows和Mac下 ...

  4. EasyUI学习总结(五)——EasyUI组件使用(转载)

    本文转载自:http://www.cnblogs.com/xdp-gacl/p/4084520.html 一.EasyUI组件的简单介绍 easyUI提供了很多组件让我们使用,如下图所示:

  5. BM算法--串匹配

    BM(Boyer-Moore)算法,后缀匹配,是指模式串的比较从右到左,模式串的移动也是从左到右的匹配过程,一般情况比KMP算法要快.时间复杂度O(m/n) C++描述(教师版) int BM(cha ...

  6. python基础之类与对象,继承与派生

    类与对象 对象的本质也就是一个名称空间而已,用于存放自己独有的属性,而类中存放的是对象共有的属性. __init__会在调用类时自动触发 调用类时发生两件事: 1.创建一个空对象stu1 2.自动触发 ...

  7. 都9102年了,还不会Docker?10分钟带你从入门操作到实战上手

    Docker简述 Docker是一种OS虚拟化技术,是一个开源的应用容器引擎.它可以让开发者将应用打包到一个可移植的容器中,并且该容器可以运行在几乎所有linux系统中(Windows10目前也原生支 ...

  8. Problem F: 调用函数,判断各位数字立方和是否等于它本身

    #include<stdio.h> #include<math.h> int is(int number)//定义函数 { ; ) { s=number%; sum=sum+p ...

  9. Codeforces Round #343 (Div. 2) C. Famil Door and Brackets dp

    C. Famil Door and Brackets 题目连接: http://www.codeforces.com/contest/629/problem/C Description As Fami ...

  10. 通过Chrome模拟和调试网速慢的情况来限制一些P2P视频网站上传速度占满的情况