Console命令詳解,讓調試js更加輕松

require(['jquery'], function($) {
    console.clear();
    // 清空控制臺

    console.info();
    // 向控制臺輸出一條信息,該信息包含一個表示“信息”的圖標,和指向該行代碼位置的超鏈接。

    console.warn();
    // 同 info。區別是圖標與樣式不同。

    console.error();
    // 同 info。區別是圖標與樣式不同。error 實際上和 throw new Error() 產生的效果相同,使用該語句時會向瀏覽器拋出一個 js 異常。

    console.assert();
    // 斷言,測試一條表達式是否為真,不為真時將拋出異常(斷言失敗)。

    console.dir();
    // 輸出一個對象的全部屬性(輸出結果類似于 DOM 面板中的樣式)。

    console.dirxml();
    // 輸出一個 HTML 或者 XML 元素的結構樹,點擊結構樹上面的節點進入到 HTML 面板。

    console.trace();
    // 輸出 Javascript 執行時的堆棧追蹤。

    console.group();
    // 輸出消息的同時打開一個嵌套塊,用以縮進輸出的內容。調用 console.groupEnd() 用以結束這個塊的輸出。

    console.groupCollapsed();
    // 同 console.group(); 區別在于嵌套塊默認是收起的。

    console.time();
    // 計時器,當調用 console.timeEnd(name);并傳遞相同的 name 為參數時,計時停止,并輸出執行兩條語句之間代碼所消耗的時間(毫秒)。

    console.profile();
    // 與 profileEnd() 結合使用,用來做性能測試,與 console 面板上 profile 按鈕的功能完全相同。

    console.count();
    // 輸出該行代碼被執行的次數,參數 title 將在輸出時作為輸出結果的前綴使用。

    // 分組
    for (var i = 1; i <= 3; i++) {
        console.group()
        for (var j = 1; j <= 3; j++) {
            console.log(i * j);
        }
        console.groupEnd();
    }

    // 各種語句顯示
    console.info("這是info");
    console.debug("這是debug");
    console.warn("這是warn");
    console.error("這是error");

    // 變量控制 支持:字符(%s)、整數(%d或%i)、浮點數(%f)和對象(%o)
    console.log("%d年%d月%d日", 2011, 3, 26); 
    console.log("圓周率是%f", 3.1415926);

    // 顯示對象
    var people = {
        name: 'Tom',
        age: 18,
        sayHello: function() {
            console.log('hello')
        }
    }

    // 顯示html結構
    var html = "<div>11</div>"
    console.dirxml(html);
})
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容