除了console.log 你还知道其他调试方法吗?

所有Console Api <script type="text/javascript">
console.dir(console);
</script>显示简单信息<script type="text/javascript">
console.log('hello world');
console.info('信息');
console.error('错误');
console.warn('警告');
</script> 占位符<script type="text/javascript">
console.log('%d-%d-%d,%s',2016,08,21,'中国女排夺的冠军!');
</script> 统计代码执行次数<script type="text/javascript">
function getInfo()
{
console.count('执行次数:');
}
getInfo();
getInfo();
getInfo();
getInfo();
</script> 显示分组信息<script type="text/javascript">
console.group("第一组信息");
console.log('第一组:自定义消息1');
console.log('第一组:自定义消息2');
console.log('第一组:自定义消息3');
console.groupEnd();

console.group("第二组信息");
console.log('第二组:自定义消息1');
console.log('第二组:自定义消息2');
console.log('第二组:自定义消息3');
console.groupEnd();
</script> 显示对象信息<script type="text/javascript">
var TomObj = {
name : "Tom",
sex : "男",
age : '31',
hobby : "coding..."
};
console.dir(TomObj);
</script> 显示页面信息<div id="console">
<h1>console api</h1>
</div>
<script type="text/javascript">
var info = document.getElementById('console');
console.dirxml(info);
</script> 判断表达式或变量是否为真<script type="text/javascript">
var code = 200;
console.assert(code);
console.assert(code == 200);
console.assert(code == 500);
</script>追踪函数的调用轨迹<script type="text/javascript">
function add(a,b) {
console.trace();
return a + b;
}

add(1,2);
add(2,3);
add(3,4);
</script>计时功能<script type="text/javascript">
console.time("控制台计时器") ;
console.log('Start');
for(var i=0;i<1000;i++) {
for(var j=0;j<1000;j++){
}
}
console.log('End');
console.timeEnd("控制台计时器");
</script> 分析性能<script type="text/javascript">
function getNews() {
_getAjax_1();
_getAjax_3();
}

function _getAjax_1 () {
for(var i=0;i<10;i++){
_getAjax_2();
}
}

function _getAjax_2 () {
for(var i=0;i<100;i++){
_getAjax_3()
}
}

function _getAjax_3 () {
for(var i=0;i<1000;i++){
}
}
console.profile('性能分析器');
getNews();
console.profileEnd();
</script> 温馨提示:尝试用起来吧,让自己爱上控制台!

上传图片,总是失败,效果图,可以查看来源链接。

Thanks ~

来源:http://mp.weixin.qq.com/s?__biz=MjM5NDM4MDIwNw==&mid=2448834664&idx=1&sn=7c4acdacc74ed1db81703be60e5537b1#rd

更多【干货分享】,请关注我的个人订阅号。

评论() 相关

收藏

赞

NTASTE

ThinkPHP 是一个免费开源的,快速、简单的面向对象的 轻量级PHP开发框架 ,创立于2006年初,遵循Apache2开源协议发布,是为了敏捷WEB应用开发和简化企业应用开发而诞生的。ThinkPHP从诞生以来一直秉承简洁实用的设计原则,在保持出色的性能和至简的代码的同时,也注重易用性。并且拥有众多的原创功能和特性,在社区团队的积极参与下,在易用性、扩展性和性能方面不断优化和改进,已经成长为国内最领先和最具影响力的WEB应用开发框架,众多的典型案例确保可以稳定用于商业以及门户级的开发。