平时在开发过程中经常需要调试js代码,console给我们提供了很大的便利,其实除了熟知的console.log(),console.dir()等,console还有很多方法十分好用。下面简单总结一下。
首先分别在谷歌,火狐,nodejs下试了一下,目前的支持情况如下:
相对来说,nodejs控制台对console的支持不是很多。
- 提示信息
console.log() 一般输出
console.info() 消息
console.warn() 警告
console.error() 错误 打印对象
console.dir() 打印对象属性
console.table() 打印对象属性以表格的形式展示(只有火狐中有效,nodejs中无该方法)分组打印
console.group() … console.groupEnd() 分组显示
/*console.group 分组显示*/ //nodejs中不能用
console.group();
console.log('1');
console.log('2');
console.groupEnd();
- 查看函数调用
console.trace() 显示函数的调用层次。
/*console.trace*/
var car;
var func1 = function() {
func2();
}
var func2 = function() {
func4();
}
var func3 = function() {
}
var func4 = function() {
car = new Car();
car.funcX();
}
var Car = function() {
this.brand = 'volvo';
this.color = 'red';
this.funcX = function() {
this.funcY();
}
this.funcY = function() {
this.funcZ();
}
this.funcZ = function() {
console.trace('trace car')
}
}
func1();
- console.assert(bool) 传入一个bool值,判断某个条件是否为真。如果为真不打印结果,为假则会报错并阻塞
/*console.assert 判断是否为真*/
var result = false;
console.assert(result); //会阻塞后面的运行
- console.time() … console.timeEnd() 查看程序运行时间,将要查看的代码放在两者之间。console.timeStamp() 打时间戳。谷歌浏览器中的console.markTimeline(),console.timeline(),console.timelineEnd()已经弃用,用以上三个代替,
/*console.time 查看程序运行时间*/
console.time();
for (var i = 0; i < 100000; i++) {
}
console.timeEnd();
- console.clear() 清楚控制台
- console.count() 统计函数执行的次数
for(var i = 0; i < 10; i++ ) {
funcA();
}
function funcA () { ... }
console.count(funcA); //打印函数funcA()执行次数
- console.profile() 性能调试,可以查看当前代码段的性能,每个函数调用的次数,比例等。其实在审查元素的profile里也可以查看,但console.profile()可以包含要查看的特定代码段,十分方便。
/*console.profiler 性能分析 nodejs 和火狐中看不到效果 在谷歌中需要打开profile查看 看到每个函数的调用比例和时间*/
function foo () {
for (var i = 0; i < 10; i++) funcA();
funcB();
}
function funcA () {
for (var i = 0; i < 1000; i++) {}
}
function funcB () {
for (var i = 0; i < 100; i++) {}
}
console.profile();
foo();
console.profileEnd();
以上是对console的简单总结。