文档章节

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

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

3 月,跳不动了?>>>

一、显示信息的命令

 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
朝阳
程序员
私信 提问
加载中

评论(0)

Java 8 Nashorn 引擎

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

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

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

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

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

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

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

jdfkldjlkjdl
2018/05/16
0
0
灵活使用 console 让 js 调试更简单

摘要: 玩转console。 原文:灵活使用 console 让 js 调试更简单 作者:前端小智 Fundebug经授权转载,版权归原作者所有。 Web 开发最常用的高度就是 ,虽然 占有一席之地,但很多人并没有意...

Fundebug
2019/04/04
11
0

没有更多内容

加载失败,请刷新页面

加载更多

Java是如何实现自己的SPI机制的? JDK源码(一)

注:该源码分析对应JDK版本为1.8 1 引言 这是【源码笔记】的JDK源码解读的第一篇文章,本篇我们来探究Java的SPI机制的相关源码。 2 什么是SPI机制 那么,什么是SPI机制呢? SPI是Service Pro...

源码笔记
43分钟前
27
0
开源分布式ID生成器UidGenerator的技术实现

1、引言 很多人一想到IM应用开发,第一印象就是“长连接”、“socket”、“保活”、“协议”这些关键词,没错,这些确实是IM开发中肯定会涉及的技术范畴。 但,当你真正开始编写第一行代码时...

SummerGao
50分钟前
28
0
设计模式-责任链模式

责任链(Chain of Responsibility)模式的定义:为了避免请求发送者与多个请求处理者耦合在一起,将所有请求的处理者通过前一对象记住其下一个对象的引用而连成一条链;当有请求发生时,可将...

muggle-
今天
11
0
看完这篇,别人的开源项目结构应该能看懂了

我为什么要写这篇 近来,和不少初学Spring或Spring Boot的小伙伴私信交流了关于项目目录结构划分和代码分层的问题。 很多小伙伴表示网上下载下来的开源项目看不懂,项目结构和代码分层看得很...

素小暖OSC
今天
22
0
如何转换高度:0; 达到高度:自动; 使用CSS? - How can I transition height: 0; to height: auto; using CSS?

问题: I am trying to make a <ul> slide down using CSS transitions. 我正在尝试使用CSS过渡使<ul>滑落。 The <ul> starts off at height: 0; <ul>从height: 0; . 。 On hover, the heig......

javail
今天
17
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部