Console使得JS代码变得更简单

来源：互联网发布：985自动化就业知乎编辑：程序博客网时间：2024/06/05 20:21
一直以来都在关注Firebug好几年，今天特意整理了一些，希望对大家有所帮助。
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>新标签页</title></head><body><div id="mydiv1"><span></span><p></p></div><script>//logconsole.group("一、显示信息的命令 \n Firebug内置一个console对象，提供5种方法，用来显示信息。");console.log("这是log");　　console.info("这是info");　　console.debug("这是debug");　　console.warn("这是warn");　　console.error("这是error");console.groupEnd();//占位符console.group("二、占位符 \n console对象可以使用printf风格的占位符。不过，占位符的种类比较少，只支持字符（%s）、整数（%d或%i）、浮点数（%f）和对象（%o）四种。");console.log("%d年%d月%d日",2011,3,26);console.log("圆周率是%f",3.1415926);var dog = {} ;dog.name = "大毛" ;dog.color = "黄色";console.log("%o",dog);console.groupEnd();//分组console.group("三、分组显示 \n 如果信息太多，可以分组显示，用到的方法是console.group()和console.groupEnd()");console.group("第一组信息");console.log("第一组第一条");console.log("第一组第二条");console.groupEnd();console.group("第二组信息");console.log("第二组第一条");console.log("第二组第二条");console.groupEnd();console.groupEnd();//查看对象console.group("四、显示一个对象所有的属性和方法 \n 使用console.dir()");dog.bark = function(){alert("汪汪汪");};console.dir(dog);console.groupEnd();console.group("五、显示网页的某个节点（node）所包含的html/xml代码 \n ");var _mydiv = document.getElementById("mydiv1");console.dirxml(_mydiv);console.groupEnd();//断言console.group("六、断言 \n console.assert()用来判断一个表达式或变量是否为真。如果结果为否，则在控制台输出一条相应信息，并且抛出一个异常。");var result = 0;　　console.assert( result);　　var year = 2000;　　console.assert(year == 2011);console.assert(true);console.groupEnd();//追踪函数调用console.group("七、追踪函数的调用轨迹 \n 使用console.trace()");　function plus(num1,num2){console.trace();　　　　return num1+num2;　　}var x = plus3(2,3);　　function plus3(num1,num2){return plus2(num1,num2);}　　function plus2(num1,num2){return plus1(num1,num2);}　　function plus1(num1,num2){return plus(num1,num2);}console.groupEnd();//消耗时间console.group("八、计时功能 \n console.time()和console.timeEnd()，用来显示代码的运行时间。");console.time("计时器一");　for(var i=0;i<1000;i++){　　　　for(var j=0;j<1000;j++){}　　}console.timeEnd("计时器一");console.groupEnd();//性能分析console.group("九、性能分析 \n 性能分析（Profiler）就是分析程序各个部分的运行时间，找出瓶颈所在，使用的方法是console.profile()。点击性能Tab查看");function funcA(count){　　　　for(var i=0;i<count;i++){}　　}　　function funcB(count){　　　　for(var i=0;i<count;i++){}　　}function Foo(){　　　　for(var i=0;i<10;i++){funcA(1000);}　　　　funcB(10000);　　}　console.profile('性能分析器一');　　Foo();　　console.profileEnd();console.groupEnd();</script></body></html>
运行结果：
0 0