Console 让调试js代码变得更简单
2016-01-01 阅读 281
Console（控制台）主要作用是显示网页加载过程中产生的各类信息。
###一、显示信息的命令
根据信息不同性质，console对象有不同的信息显示方法：
console.log() 内容信息
console.info() 一般信息
console.debug() 出错信息
console.warn() 警告信息
console.error() 错误提示
###二、占位符
console对象的五种方法，都可以使用printf风格的占位符。不过，占位符的种类比较少，只支持字符(%s)、
整数(%d或%i)、浮点数(%f)和对象(%o)四种。
console.log("%dY%ds%dd", 2016,01,01);
console.log("圆周率是%f",3.1415926);
%o占位符，可以用来查看一个对象内部情况。比如，有这样一个对象：
var dog = {};
dog.name = "da mao";
dog.color = "yellow";
然后，对它使用o%占位符：
console.log("o%", dog);
###三、分组显示
如果信息太多，可以分组显示，用到的方法是console.group() AND console.console.groupEnd()
console.group("第一组信息");
console.log("第一组第一条");
console.log("第一组第二条");
console.groupEnd();
console.group("第二组信息");
console.log("第二组第一条");
console.log("第二组第二条");
console.groupEnd();
###四、console.dir()
console.dir()可以显示一个对象所有的属性和方法。
比如，现在位第二节的dog对象，添加一个bark()方法。
dog.bark = function(){alert("hello word!");};
然后，显示该对象的内容，
console.dir(dog);
###五、console.dirxml()
console.dirxml()用来显示网页的某个节点（node）所包涵的html/xml代码
比如，先获取一个表格节点，
var table = document.getElementById("table");
然后，显示该节点包涵的代码。
console.dirxml(table);
###六、console.assert()
console.assert()用来判断一个表达式或变量是否为真。如果结果为否，则在控制台输出一条相应的信息，
并且抛出一个异常。
比如，下面两个判断的结果都为否。
var result = 0;
console.assert(result);
var year = 2016;
console.assert(year == 2011);
###七、console.trace()
console.trace()用来追踪函数的调用轨迹。
比如，有一个假发器函数。
function add(){
return a+b;
}
我想知道这个函数是如何被调用的，在其中加入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);}
###八、计时功能
console.time() AND console.timeEnd(),用来显示代码的运行时间
console.time("计时器一");
for(var i = 0; i < 1000; i++){
for(var j = 0; j < 1000; j++;){}
}
console.timeEnd("计时器一");
###九、性能分析
性能分析（Profiler）就是分析程序各个部分的运行时间，找出瓶颈所在，使用的方法是console.profile()
假定有一个函数Foo()，里面调用了另外两个函数funcA() AND funcB(),其中funcB()调用10次，funB()调用1次。
function Foo(){
for(var i = 0; i < 10; i++;){funcA(1000);}
funcB(1000);
}
function funcA(count){
for(var i = 0; i < count; i++){}
}
然后，就可以分析Foo()的运行性能了。
console.profile("性能分析器一")；
Foo();
console.profileEnd();
更新于 2023年03月28日
