JavaScript Console 对象-小佑Blog| 小佑前端 | WEB前端博客

Console 对象用于 JavaScript 调试。
JavaScript 原生中默认是没有 Console 对象,这是宿主对象（也就是游览器）提供的内置对象。用于访问调试控制台, 在不同的浏览器里效果可能不同。

Console 对象常见的两个用途：

显示网页代码运行时的错误信息。
提供了一个命令行接口，用来与网页代码互动。
以 Chrome浏览器为例，我们可以通过按 F12 或者 Control+Shift+i（PC平台）/ Alt+Command+i（Mac平台）来打开 Console 窗口。

Console 对象方法

assert();

assert方法接受两个参数，第一个参数是表达式，第二个参数是字符串。只有当第一个参数为false，才会输出第二个参数，否则不会有任何结果。

console.assert(1 == false,"执行assertFn") // 执行 

console.assert(1 == false,"执行assertFn") // 不执行

clear()

清除当前控制台的所有输出，将光标回置到第一行。

console.clear()

count()

用于计数，输出它被调用了多少次。

~(function(){
     for(var i=0;i<5;i++){
	  console.count('count'); 
     }
})()

error()

输出信息时，在最前面加一个红色的叉，表示出错，同时会显示错误发生的堆栈。

console.error("Error: %s (%i)", "Server is not responding",500)

group()

用于将显示的信息分组，可以把信息进行折叠和展开。默认展开

console.group('第一层');
  console.group('第二层');

    console.log('error');
    console.error('error');
    console.warn('error');

groupCollapsed()

与console.group方法很类似，唯一的区别是该组的内容，在第一次显示时是收起的（collapsed），而不是展开的。默认收起

console.groupCollapsed('第一层');
  console.groupCollapsed('第二层');

    console.log('error');
    console.error('error');
    console.warn('error');

  console.groupEnd(); 
console.groupEnd();

groupEnd()

结束内联分组，

console.group('Group One');
console.group('Group Two');

// some code

console.groupEnd(); // Group Two 结束
console.groupEnd(); // Group One 结束

console.group('Group One');
console.group('Group Two');

info()

console.log 别名，输出信息

console.info("runoob")

log()

console.log // 输出信息,不多介绍了

table()

将复合类型的数据转为表格显示。

var arr = [
    {
        name:"op",
        num:1
    },{
        name:"jk",
        num:2
    },{
        name:"xb",
        num:3
    }
]
console.table(arr);

var obj = {
   a:{
       num:1,
       name:"笑一下"
   },
   b:{
       num:3,
       name:"哭了"
   },
    c:{
       num:3,
       name:"哭了"
   }
}
console.table(obj);

time()

计时开始,配合下面计时结束使用

console.time('计时器1');
for (var i = 0; i < 100; i++) {
  for (var j = 0; j < 100; j++) {}
}
console.timeEnd('计时器1');
console.time('计时器2');
for (var i = 0; i < 1000; i++) {
  for (var j = 0; j < 1000; j++) {}
}
console.timeEnd('计时器2');

timeEnd()

计时结束,配合上面计时结束使用

console.time('计时器1');
for (var i = 0; i < 100; i++) {
  for (var j = 0; j < 100; j++) {}
}
console.timeEnd('计时器1');
console.time('计时器2');
for (var i = 0; i < 1000; i++) {
  for (var j = 0; j < 1000; j++) {}
}
console.timeEnd('计时器2');

trace()

追踪函数的调用过程,可以看到Fn函数执行步骤

function d(a) { 
  console.trace();
  return a;
}
function b(a) { 
  return c(a);
}
function c(a) { 
  return d(a);
}
var a = b('123');

warn()

输出警告信息

console.warn("警告")

占位符	作用
%s	字符串
%d or %i	整数
%f	浮点数
%o	可展开的DOM
%O	列出DOM的属性
%c	根据提供的css样式格式化字符串

console.log("%d年%d月%d日",2011,3,26);

目录CONTENT

JavaScript Console 对象