js调试工具console方法详解
一、显示信息的方法
最常用的console.log(),一般用来调试。
console.log('hello');
console.info('信息');
console.error('错误');
console.warn('警告');
效果:
二、占位符
console上述的集中度支持printf的占位符格式,支持的占位符有:字符(%s)、整数(%d或%i)、浮点数(%f)和对象(%o
console.log("%d年%d月%d日",2011,3,26);
效果:
三、信息分组
console.group("第一组信息");
console.log("第一组第一条");
console.log("第一组第二条");
console.groupEnd();
console.group("第二组信息");
console.log("第二组第一条");
console.log("第二组第二条");
console.groupEnd();
效果:

四、查看对象的信息
var obj = {
name: 'ali',
age: '20',
showName: function () {
alert(this.name);
}
}
console.dir(obj);
效果:

五、显示某个节点的内容
var info = document.getElementById('info');
console.dirxml(info);
效果:

六、判断变量是否是真
var result = 1;
console.assert( result );
var year = 2014;
console.assert(year == 2018 );
效果:

七、追踪函数的调用轨迹
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);}
效果:

八、计时功能
console.time("控制台计时器一");
for(var i=0;i<1000;i++){
for(var j=0;j<1000;j++){}
}
console.timeEnd("控制台计时器一");
效果:

九、的性能分析
function All(){
alert(11);
for(var i=0;i<10;i++){
funcA(1000);
}
funcB(10000);
}
function funcA(count){
for(var i=0;i<count;i++){}
}
function funcB(count){
for(var i=0;i<count;i++){}
}
console.profile('性能分析器');
All();
console.profileEnd();
效果:

chrome貌似不起作用,盗了一张firebug的图...
js调试工具console方法详解的更多相关文章
- js调试工具Console命令详解
这篇文章主要介绍了js调试工具Console命令详解,需要的朋友可以参考下 一.显示信息的命令 复制代码 代码如下: < !DOCTYPE html> < html> &l ...
- js调试工具Console命令详解——转
一.显示信息的命令 <!DOCTYPE html> <html> <head> <title>常用console命令</title> < ...
- Js apply call方法详解
Js apply方法详解 我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这 ...
- JS之console.log详解以及兄弟姐们邻居方法扩展
console.log() 基本用法 console.log,前端常用它来调试分析代码,你可以在任何的js代码中调用console.log(),然后你就可以在浏览器控制台看到你刚才打印的常量,变量,数 ...
- JS进阶篇--JS数组reduce()方法详解及高级技巧
基本概念 reduce() 方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值. reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被 ...
- JS数组reduce()方法详解及高级技巧
1.语法 arr.reduce(callback,[initialValue]) reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上 ...
- Js apply call方法详解【转】
我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家 ...
- js cookie使用方法详解
代码如下 复制代码 <script>function getCookie(c_name){ if (document.cookie.length>0){ //先查询cookie是否为 ...
- js数组sort方法详解
在处理数组的时候,我们有时候需要对数组进行排序,排序的方法有很多种,但是最好最快的就是利用sort方法进行快速的排序. 我们来看一个例子: var arr1 = [6, 3, 4, 1, 2, 5, ...
随机推荐
- 洛谷P3690 [模板] Link Cut Tree [LCT]
题目传送门 Link Cut Tree 题目背景 动态树 题目描述 给定n个点以及每个点的权值,要你处理接下来的m个操作.操作有4种.操作从0到3编号.点从1到n编号. 0:后接两个整数(x,y),代 ...
- 子树(LintCode)
子树 有两个不同大小的二进制树: T1 有上百万的节点:T2 有好几百的节点.请设计一种算法,判定 T2 是否为 T1的子树. 样例 下面的例子中 T2 是 T1 的子树: 1 3 / \ / T1 ...
- 最短路&生成树&二分图匹配&费用流问题
最短路 题意理解,建图 https://vjudge.net/problem/UVALive-4128 飞机票+行程建图 https://vjudge.net/problem/UVALive-3561 ...
- 可持久化01Trie树+LCA【p4592】[TJOI2018]异或
Description 现在有一颗以\(1\)为根节点的由\(n\)个节点组成的树,树上每个节点上都有一个权值\(v_i\).现在有\(Q\)次操作,操作如下: 1\(\;x\;y\):查询节点\(x ...
- 【BZOJ 2288】 2288: 【POJ Challenge】生日礼物 (贪心+优先队列+双向链表)
2288: [POJ Challenge]生日礼物 Description ftiasch 18岁生日的时候,lqp18_31给她看了一个神奇的序列 A1, A2, ..., AN. 她被允许选择不超 ...
- 进入bios后没有usb启动项怎么办
开机按DEL进入BIOS(现在还这么说吧,不同的主板进入方法不太一样),找到BOOT选项. 选择Boot mood:legacy support(引导模式,逻辑支持) boot priorty:leg ...
- [BZOJ2109][NOI2010]航空管制(贪心+拓扑)
2109: [Noi2010]Plane 航空管制 Time Limit: 10 Sec Memory Limit: 512 MBSubmit: 1227 Solved: 510[Submit][ ...
- [BZOJ1975][SDOI2010]魔法猪学院(k短路,A*)
1975: [Sdoi2010]魔法猪学院 Time Limit: 10 Sec Memory Limit: 64 MBSubmit: 2748 Solved: 883[Submit][Statu ...
- CodeForces - 995B Suit and Tie
题面在这里! 明明可以出成n<=1e5但是因为拒绝写数据结构而只出到n<=100,,,出题人真的很棒棒.. 一个显然的贪心就是,把和当前序列最左端的数匹配的数移到它的右边,这样迭代下去总是 ...
- Spring MVC常用注解@PathVariable、@RequestHeader、@CookieValue、@RequestParam、@RequestBody、@SessionAttributes、@ModelAttribute
简介: handler method参数绑定常用的注解,我们根据他们处理的Request的不同内容部分分为四类:(主要讲解常用类型) A.处理requet uri部分(这里指uri template中 ...

