文档章节

九个Console命令,让js调试更简单

tpythoner
 tpythoner
发布于 2015/06/28 23:39
字数 513
阅读 468
收藏 43

一、显示信息的命令

 console.log('详情');
 console.error('错误');
 console.warn('警告');


二:占位符console上述的集中度支持printf的占位符格式,支持的占位符有:字符(%s)、整数(%d或%i)、浮点数(%f)和对象(%o)

 console.log("%d年%d月%d日",2015,6,28);


三、信息分组

console.group("我的信息");
console.log("用户名:tpythoner");
console.log("我的博客:OSCHINA(http://my.oschina.net/tpythoner)");
console.groupEnd();


四、查看对象的信息

  console.dir()可以显示一个对象所有的属性和方法。

 var info = {'username' : 'tpythoner', 'email' : 'admin@gmail.com'};
 console.dir(info);


五、显示某个节点的内容

console.dirxml()用来显示网页的某个节点(node)所包含的html/xml代码。

<div id="info">
    <p>程序爱好者:tpyhoner</p>
</div>
<script type="text/javascript">
    var info = document.getElementById('info');
    console.dirxml(info);
</script>


六、判断变量是否是真

console.assert()用来判断一个表达式或变量是否为真。如果结果为否,则在控制台输出一条相应信息,并且抛出一个异常。

var result = 1;
console.assert(result);
var year = 2015;
console.assert(year == 2016);


1是非0值,是真;而第二个判断是假,在控制台显示错误信息 

七、追踪函数的调用轨迹。

console.trace()用来追踪函数的调用轨迹。

<script type="text/javascript">
/*函数是如何被调用的,在其中加入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);}
</script>


八、计时功能

console.time()和console.timeEnd(),用来显示代码的运行时间。

<script type="text/javascript">
  console.time("控制台计时器一");
  for(var i=0;i<1000;i++){
    for(var j=0;j<1000;j++){}
  }
  console.timeEnd("控制台计时器一");
</script>


九、console.profile()的性能分析

function doTask(){
  doSubTaskA(1000);
  doSubTaskA(100000);
  doSubTaskB(10000);
  doSubTaskC(1000,10000);
}
function doSubTaskA(count){
  for(var i=0;i<count;i++){}
}
 
function doSubTaskB(count){
  for(var i=0;i<count;i++){}
}
 
function doSubTaskC(countX,countY){
  for(var i=0;i<countX;i++){
    for(var j=0;j<countY;j++){} 
  }
}
console.profile();
doTask();
console.profileEnd();


性能分析(Profiler)就是分析程序各个部分的运行时间,找出瓶颈所在,使用的方法是console.profile()。


本文转载自:http://bbs.html5cn.org/thread-84358-1-1.html

共有 人打赏支持
下一篇: Docker总结
tpythoner
粉丝 2
博文 22
码字总数 6355
作品 0
朝阳
程序员
私信 提问
Java 8 Nashorn 引擎

Java 8 Nashorn 脚本引擎 java8 终于来了.函数式接口,lambda表达式期待很久了.新的武器在手,应该可以玩出新花样. 前两天无意中发现java8 中还带了另外一个有意思的东西. Nashorn 一个javascr...

架构梦想
2014/03/25
0
33
Web移动应用调试工具——Weinre

由于前面介绍的方式不太给力,于是找到了资深的学长问了问,他告诉我有个叫weinre的插件很不错,在进一步了解,发现了这篇文章。 weinre官网:http://people.apache.org/~pmuellr/weinre/do...

Megan_zhou
2013/06/14
0
0
JavaScript Debug 之 Console

简评:只知道 console.log ?是时候提升一下对 console 的认知了。 JavaScript console 是现代浏览器的一种内置功能,它允许开发者: 查看网页上的错误和警告日志。 使用 JavaScript 命令与网...

极小光
06/28
0
0
Android调试神器stetho

概述 关于stetho,最开始是同事推荐的,主要用来通过Chrome的inspect命令来查看数据库数据的。配置好stetho环境后,在浏览器中输入chrome://inspect,找到需要调试的对象,点击inspect即可调...

jdfkldjlkjdl
05/16
0
0
Indium: 在Emacs中使用Chrome调试协议调试JavaScript

日常在Web开发中, 一般都是在Emacs敲好代码中, 打开Chrome测试, 调试的时候直接调用 Chrome 内建的 DevTools/Console 中快速的调试和定位 JavaScript 代码的问题. 一般的都是这样玩的, 在Chr...

ManateeLazyCat
09/17
0
0

没有更多内容

加载失败,请刷新页面

加载更多

腾讯云与MariaDB 基金会签署战略合作,共建全球开源生态圈

本文由云+社区发表 腾讯云日前与MariaDB基金会正式签署战略合作协议,2019年,腾讯云将继续以白金会员身份为基金会的发展提供强有力的资源支持,与MariaDB全球用户和开发者一道,共建开放共赢...

腾讯云加社区
11分钟前
1
0
Kotlin的SAM(Single Abstract Method)

今天有人在群里问kotlin支持SAM的问题,其实kotlin不支持SAM,因为人家支持FP(function programing) package reactinterface Test { fun print()}class TestInterface(var...

SuShine
13分钟前
1
0
IntelliJ idea 配置文件ascii码转换

配置文件中的中文会转成ascii码: ############# \u6570\u636e\u6e90\u914d\u7f6e start ############# 无法查看器内容,把ascii码转换成中文有两种方式 方式一: File -> Settings -> Edit...

燃犀
14分钟前
1
0
区块链开发入门教程【加精】

区块链的重要性已经毋庸置疑,但对大多数跃跃欲试的开发者而言,去中心化思想、 非对称加密、共识算法等技术点的理解和运用,都是入门区块链开发的挑战。合适 的区块链开发教程可以极大地缩短...

汇智网教程
16分钟前
3
0
数据库智能运维探索与实践

从自动化到智能化运维过渡时,美团DBA团队进行了哪些思考、探索与实践?本文根据赵应钢在“第九届中国数据库技术大会”上的演讲内容整理而成,部分内容有更新。 背景 近些年,传统的数据库运...

美团技术团队
19分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部