接着上一篇前端实用的调试命令console使用
查看所有方法
console
除了上面的几个方法还有什么方法呢?log
除了能打印字符串外,还能打印出对象,我们可以利用 console.log
打印自己。
代码:
console.log(console);
输出:
Object {
assert: ...,
clear: ...,
count: ...,
debug: ...,
dir: ...,
dirxml: ...,
error: ...,
group: ...,
groupCollapsed: ...,
groupEnd: ...,
info: ...,
log: ...,
markTimeline: ...,
profile: ...,
profileEnd: ...,
table: ...,
time: ...,
timeEnd: ...,
timeStamp: ...,
timeline: ...,
timelineEnd: ...,
trace: ...,
warn: ...
}
上面的 console
是 chrome浏览器
中打印出来的 。
我们可以在 开发环境
中,合理的利用
这些方法来帮助我们开发。
十一:清理控制台
如果我们在控制台调试的时候。浏览器和命令行 clear
一样提供了一个清理函数 console.clear()
。
console.clear()
当然我们也可以用 chrome
的 command line api
来清理控制台。
clear()
又或者可以使用按键Mac上 cmd + k
,Win ctrl + l
(我用的是chrome浏览器
)。
十二:分组并展开
当代码非常长,或者我们需要把一个函数,或者一个文件中的函数等区分出来。我们可以使用分组来实现。
上一篇用group可以分组,但是每次都要手动展开,我们可以使用 console.groupCollapsed
,用法和 console.group
类似。
代码:
console.group('人');
console.log("手");
console.log("脚");
console.groupEnd();
console.group('修仙');
console.log("法力无边");
console.log("腾云架雾");
console.groupEnd();
输出:
十三:查看运行堆栈
console.trace
可以看透运行时的结果栈。
代码:
function add(num) {
if (0 < num) {
console.trace("现在num的值为", num);
return num + add(num - 1);
} else {
return 0;
}
}
var a =3;
add(3);
输出:
十四:统计次数
有时候我们需要统计一个函数或者被调用了几次,我们通常会增加一个变量 count
来记录,然后在控制台中查看。这样相当的麻烦,我们可以使用 console.count
函数来帮忙我们记录次数,并输出。
function hi(name) {
console.count(name);
return "hi " + name;
}
for(var i = 0; i < 10; i++) {
if(i < 4) {
hi("person");
} else {
hi("god");
}
}
结果:
person: 1
person: 2
person: 3
person: 4
god: 1
god: 2
god: 3
god: 4
god: 5
god: 6