JS的 console 对象

console对象的各种方法介绍

1.console.assert()方法

//示例代码  
//声明一个名为People的构造函数  
function People(name,age,performance){  
        this.name = name;  
        this.age = age;  
        this.performance = performance;  
}  
//引用上面的构造函数People,声明变量people  
var people =new People("john",20,[80,90,99]);  
//调用console.assert()方法  
console.assert( people.performance.length == 3, "长度不准确");  
  
//说明  
//上面在调用console.assert()的意思是：  
//如果people.performance.length == 3返回的结果是true，  
//就不输出"长度不准确"；  
//如果people.performance.length == 3返回的结果是false，  
//就输出"长度不准确"；  

2.console.clear()方法

//示例代码  
    console.log("john");  
    console.clear();  
    console.log("is a good man");  
  
    //说明  
    console.clear()主要的作用是：  
    清空浏览器中的打印输出面板，也就是清空浏览器里面的console  

3.console.count()方法

//实力代码  
    //定义一个简单的加法函数addition  
    function addition(a, b) {  
        //调用console.count()方法  
        console.count('addition function called times:');  
        return a + b;  
    }  
  
    //声明一个变量  
    var sum = 0;  
    for(var i = 0; i < 20; i++) {  
        if(i % 2 == 0) {  
             sum = addition(sum, i);  
        }  
    }  
    console.log(sum);  
  
    //说明  
    //console.count()方法用于统计代码块被执行的次数，  
    //console.count()参数是可选的标题，方便阅读  

4.console.debug()方法，console.info()方法 console.warn()方法 , console.error()方法 console.log()方法

//console以上方法支持类似C语言的占位符，  
  //如 %s=>字符串, %d=>整数, %f=>浮点数, %o=>object  
  
  //示例代码  
  console.log('I %s more than %d %o.', 'want', 3, {animal: 'dogs', color: 'black'});  
  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'});  
  
  //说明  
  //上面几个方法比较简单，就不细说了  

5.console.dir()方法

//示例代码  
    //声明一个名为People的构造函数  
    function People(name,age,performance){  
        this.name = name;  
        this.age = age;  
        this.performance = performance;  
    }  
    //引用上面的构造函数People,声明变量people  
    var people =new People("john",20,[80,90,99]);  
    //调用console.dir()方法  
    console.dir( people );  
  
    //说明  
    //在调试JavaScript程序时，有时需要转储对象的详细信息。  
    //通过手工编写JavaScript代码可以完成这一工作：  
    //针对对象的属性进行循环，将循环到的每一个属性值打印出来；  
    //可见，这一过程是比较繁琐的，但是在具备调试工具的浏览器上，  
    //通过console.dir()方法可以轻松完成  

5.console.dirxml()方法

//示例代码  
    console.log(document.getElementById('myDiv'));  
    console.dirxml(document.getElementById('myDiv'));  
  
    //说明  
    输出网页的某个节点（node）包含的html/xml代码，  
    与console.log()功能相似  
6.console.group()方法
[javascript] view plain copy
console.groupCollapsed()方法  
      console.groupEnd()方法  
  
      //示例代码  
      console.group('第一组');  
      console.log('1.1');  
      console.log('1.2');  
      console.log('1.3');  
      console.groupEnd();  
  
      console.groupCollapsed('第二组');  
      console.log('2.1');  
      console.log('2.2');  
      console.log('2.3');  
      console.groupEnd();  
  
      //说明  
      //console.group()默认展开  
      //console.groupCollapsed()默认关闭  
      //console.groupEnd()结束分组  

7.console.profile()方法 console.profileEnd()方法

//示例代码  
      function AllFunction(){  
          for(var i=0;i<100;i++){  
              functionA(10000);  
          }  
          functionB(10000);  
      }  
  
      function functionA(count){ for(var i=0;i<count;i++){} }  
      function functionB(count){ for(var i=0;i<count;i++){} }  
  
      console.profile('profile');  
      AllFunction();  
      console.profileEnd();  
  
      //说明  
      //分析profile和profileEnd之间代码的执行情况，即js代码的性能分析。  
      //注意，如果代码运行时间过短，则在性能分析时可能会被忽略（如上面的函数functionB）:  
      //在浏览器的开发工具中的profile面板里可以看到结果  

8.console.table()方法

//示例代码  
//数组  
var dataArr = [  
    [111, 222, 332],  
    [442, 555, 666]  
];  
console.table(dataArr);  
  
//JSON对象  
var dataJson = [  
    {'a':'1.11', 'b':'2.2'},  
    {'a':'11.1', 'b':'22.2'},  
    {'a':'111.1', 'b':'222.2'}  
];  
console.table(dataJson);  
  
//说明  
//table方法用于把data对象用表格的方式显示出来，  
//在显示数组或格式一样的JSON数据时很有用：  

9.console.time()方法，console.timeEnd()方法

//示例代码  
    console.time('time');  
    for(var i = 0; i < 1000; i++) {  
        for(var j = 0; j < 1000; j++) { }  
    }  
    console.timeEnd('time');  
  
    //说明  
    //计算time和timeEnd之间代码块的执行时间并显示  
    //从而来判断JavaScript语法的性能  
10.console.trace()方法
[javascript] view plain copy
//示例代码  
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);}  
  
//说明  
//console.trace()用来追踪函数的调用轨迹  
//可以查看函数是怎么样调用的！