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);
})
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容