JavaScript调试之console命令的各函数用法

1、console.log(object[, object, …])
console.log 输出信息到 console 窗口，支持多个参数，并一起显示：

console.log('I like', {'a': 'Dog', 'b': 'Cat'}, 'A');

console.log 方法支持类似C语言的占位符，如 %s=>字符串, %d=>整数, %f=>浮点数, %o=>object，用法如下：

console.log('I %s more than %d %o.', 'want', 3, {animal: 'dogs', color: 'black'});

2、console.debug, console.info, console.warn, console.error
用法与console.log一样，只是显示的样式不一样：

console.debug('I like', {'a': 'Dog', 'b': 'Cat'}, 'A');        console.debug('I %s more than %d %o.', 'want', 3, {animal: 'dogs', color: 'black'});        console.info('I like', {'a': 'Dog', 'b': 'Cat'}, 'A');        console.info('I %s more than %d %o.', 'want', 3, {animal: 'dogs', color: 'black'});        console.warn('I like', {'a': 'Dog', 'b': 'Cat'}, 'A');        console.warn('I %s more than %d %o.', 'want', 3, {animal: 'dogs', color: 'black'});        console.error('I like', {'a': 'Dog', 'b': 'Cat'}, 'A');        console.error('I %s more than %d %o.', 'want', 3, {animal: 'dogs', color: 'black'});

3、console.assert(expression[, object, …])
当expression的值为false时，输出后面的信息：

        console.assert(1 == 2, 3);        console.assert('a' == 'a', {'a': 'Hello'});        console.assert('a' == 'b', {'b': 'World'});

4、console.clear()
清空console中在该方法之前输出的所有信息：

        console.log('Hello');        console.clear();        console.log('World!');

5、console.dir(object)
输出一个对象所有的属性和方法：

        var Animal = {            name: '旺财',            type: 'dog',            yell: function () {                console.log('汪汪');            }        };        console.dir(Animal);

6、console.dirxml(node)
输出网页的某个节点（node）包含的html/xml代码，与console.log()类似：

        console.log(document.getElementById('myDiv'));        console.dirxml(document.getElementById('myDiv'));

7、console.trace()
查看函数的调用堆栈信息，即当前函数是如何被调用的：

        function add(a, b) {            console.trace();            return a + b;        };        function add1(a, b) {            return add(a, b);        }        function add2(a, b) {            return add1(a, b);        };        function add3(a, b) {            return add2(a, b);        };        var c = add3(2, 5);        console.log(c);

8、console.group(object[, object, …])，console.groupCollapsed()，consoele.groupEnd()
把log等方法的输出信息分组显示以方便查看，groupCollapsed于group用法相同，只是默认折叠显示：

        console.group('第一组');        console.log('1.1');        console.log('1.2');        console.groupEnd();        console.groupCollapsed('第二组');        console.log('2.1');        console.log('2.2');        console.groupEnd();

9、console.time(timeName)，console.timeEnd(timeName)
计算time和timeEnd之间代码的执行时间并显示：

        console.time('time');        for(var i = 0; i < 1000; i++) {            for(var j = 0; j < 1000; j++) {            }        }        console.timeEnd('time');

10、console.profile(profileName)，console.profileEnd(profileName)
分析profile和profileEnd之间代码的执行情况，即js代码的性能分析。注意，如果代码运行时间过短，则在性能分析时可能会被忽略（如下面的函数funcB）：

        function All(){            for(var i=0;i<100;i++){                funcA(10000);            }            funcB(10000);        }        function funcA(count){            for(var i=0;i<count;i++){}        }        function funcB(count){            for(var i=0;i<count;i++){}        }        console.profile('profile');        All();        console.profileEnd();

11、console.count([title])
count方法用于统计代码被执行的次数，title参数是可选的标题，方便阅读：

        function add(a, b) {            console.count('add called times:');            return a + b;        }        var sum = 0;        for(var i = 0; i < 100; i++) {            if(i % 20 == 0) {                sum = add(sum, i);            }        }        console.log(sum);

12、console.table(data)
table方法用于把data对象用表格的方式显示出来，在显示数组或格式一样的JSON数据时很有用：

        var dataArr = [[11, 22, 33], [44, 55, 66]];        console.table(dataArr);        var dataJson = [{'a':'1', 'b':'2'}, {'a':'11', 'b':'22'}, {'a':'111', 'b':'222'}];        console.table(dataJson);