JS中的九個console命令以及用法

1、顯示信息的命令 根據信息的不一樣，console對象有四種顯示信息的方法，分別是

console.log('text'); 日誌的輸出

console.info('信息'); 信息提示

console.error('錯誤'); 錯誤信息

console.warn('警告'); 警告信息 效果：

其中console.log 最經常使用

二：佔位符 console對象的五種方法均可以使用printf的風格的佔位符，支持的佔位符有：字符（%s）、整數（%d或%i）、浮點數（%f）和對象（%o）

console.log("%d年%d月%d日",2011,3,26);
console.log("圓周率是%f",3.1415926);
複製代碼

效果：

3、信息分組

console.group("第一組信息");        
    console.log("第一組第一條信息");
    console.log("第一組第二條信息");
    console.groupEnd();//第一組信息結束；能夠開始第二條
    console.group("第二組信息");
    console.log("第二組第一條信息");
    console.log("第二組第二條信息");
    console.groupEnd();//第二組信息結束
複製代碼

效果：

4、查看對象的屬性和方法 console.dir()能夠顯示一個對象全部的屬性和方法。

var info = {
    name:"Bob",
    age:23,
    message:"今年大學畢業"
};
console.dir(info);
複製代碼

效果：

5、顯示某個節點的內容 console.dirxml()用來顯示網頁的某個節點（node）所包含的html/xml代碼。

var table = document.getElementById("table1");
console.dirxml(table);
複製代碼

效果和上一個相似。

6、判斷變量是不是真 console.assert()用來判斷一個表達式或變量是否爲真。若是結果爲否，則在控制檯輸出一條相應信息，而且拋出一個異常。

var result = 1;  
console.assert(result);  
var year = 2018;  
console.assert(year == 2015);
var year = 2018;  
console.assert(year == 2018);
複製代碼

1是非0值，是真；而第二個判斷是假，在控制檯顯示錯誤信息 效果：

7、追蹤函數的調用軌跡。 console.trace()用來追蹤函數的調用軌跡。

/*函數是如何被調用的，在其中加入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);
}
複製代碼

效果：

8、計時功能 console.time()和console.timeEnd()，用來顯示代碼的運行時間。

console.time("控制檯計時器");//計時開始  
for (var i = 0; i < 1000; i++) {&emsp;&emsp;&emsp;&emsp;
    for (var j = 0; j < 1000; j++) {}&emsp;&emsp;
}&emsp;&emsp;
console.timeEnd("控制檯計時器");//計時結束
複製代碼

運行時間是：4.843994140625s

9、console.profile()的性能分析 性能分析（Profiler）就是分析程序各個部分的運行時間，找出瓶頸所在，使用的方法是console.profile() 假定有一個函數Foo()，裏面調用了另外兩個函數funcA()和funcB()，其中funcA()調用10次，funcB()調用1次。

  function Foo(){
&emsp;&emsp;&emsp;&emsp;for(var i=0;i<10;i++){funcA(1000);}
&emsp;&emsp;&emsp;&emsp;funcB(10000);
&emsp;&emsp;}
&emsp;&emsp;function funcA(count){
&emsp;&emsp;&emsp;&emsp;for(var i=0;i<count;i++){}
&emsp;&emsp;}
&emsp;&emsp;function funcB(count){
&emsp;&emsp;&emsp;&emsp;for(var i=0;i<count;i++){}
&emsp;&emsp;}
複製代碼

而後，就能夠分析Foo()的運行性能了。

  console.profile('性能分析器一');
  Foo();
  console.profileEnd();
複製代碼

控制檯會顯示一張性能分析表，一共運行了12個函數，共耗時2.656毫秒。其中funcA()運行10次，耗時1.391毫秒，最短運行時間0.123毫秒，最長0.284毫秒，平均0.139毫秒；funcB()運行1次，耗時1.229ms毫秒。

除了使用console.profile()方法，firebug還提供了一個"概況"（Profiler）按鈕。第一次點擊該按鈕，"性能分析" 開始，你能夠對網頁進行某種操做（好比ajax操做），而後第二次點擊該按鈕，"性能分析"結束，該操做引起的全部運算就會進行性能分析。