利用Js的console对象,在控制台打印调式信息测试Js的实现

利用Js的console对象,在控制台打印调式信息测试Js的实现

某次访问百度时按下F12，发现控制台输出了招聘广告，由此萌生了撰写此文的念头。

既然能在控制台输出信息，调试Js时将大幅简化流程。为确保内容准确，通过for(var i in console)检查了各浏览器对console的支持情况。

测试结果如下：

IE 11 控制台

log , info , warn , error , debug , assert , time , timeEnd , group , groupCollapsed , groupEnd , trace , clear , dir , dirxml , count , countReset , cd , select , profile , profileEnd

Firebug 控制台

log , debug , info , warn , exception , assert , dir , dirxml , trace , group , groupCollapsed , groupEnd , profile , profileEnd , count , clear , time , timeEnd , timeStamp , table , error

Chrome 控制台

memory , _commandLineAPI , debug , error , info , log , warn , dir , dirxml , table , trace , assert , count , markTimeline , profile , profileEnd , time , timeEnd , timeStamp , timeline , timelineEnd , group , groupCollapsed , groupEnd , clear

上述测试表明，IE 11、Firefox（需加载Firebug插件）及Chrome均支持log、info、warn、error、debug这五个基本方法。若浏览器不支持console，则需封装判断逻辑，回退至alert等其他方法以方便使用。

基础用法示例：

console.log("日志信息"); console.info("一般信息"); console.debug("调试信息"); console.warn("警告提示"); console.error("错误提示");

格式化输出示例：

console.log("%d年%d月%d日", 2014, 5, 20);//日期格式输出 console.log('%c有颜色的输出信息', 'color:white; background-color:#0055CC');//格式输出

变量输出示例：

var who= 'you'; console.log('输出变量 We support ', you);//读取变量

数组输出示例：

var arr = [1, 2, 3, 4, 5]; console.log('数组：', arr);//输出数组

以上关于利用Js的console对象在控制台打印调试信息测试Js的实现内容，旨在提供参考，感谢支持。