console

Console 对象用于 JavaScript 调试。

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

console输出内容添加css样式

let s='1000'
console.log(`%c${s}`,"color: red; font-size: 20px");

console信息分组

console.group("第一组信息");
  console.log("第一组第一条");
  console.log("第一组第二条");
console.groupEnd();
  
console.group("第二组信息");
  console.log("第二组第一条");
  console.log("第二组第二条");
console.groupEnd();

console.trace追踪函数的调用轨迹

/*函数是如何被调用的，在其中加入console.trace()方法就可以了*/
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);}

VM1562:3 console.trace
add @ VM1562:3
add1 @ VM1562:9
add2 @ VM1562:8
add3 @ VM1562:7
(anonymous) @ VM1562:6

console计时功能

console.time() 和 console.timeEnd()，用来显示代码的运行时间。

console.time("控制台计时器一");
for(var i=0;i<1000;i++){
  for(var j=0;j<1000;j++){}
}
console.timeEnd("控制台计时器一");

console table

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

(index)	num
0	'1'
1	'2'
2	'3'

console其他基本信息

console.log('hello');
console.info('信息');
console.error('错误');
console.warn('警告');
console.clear()//清空控制台

function log(a,b=undefined,c=false){
	try{
		if(c){
			return console.log(`%c${a}`,b,weiType(a))
		}else{
			return console.log(`%c${a}`,b)
		}
	}catch(e){
		console.log('error',e)
	}
	
}
function weiType(val){
	if(arguments.length === 1){
		if(typeof(val)!=='object'){
			return typeof(val)
		}else{
			let gettype =Object.prototype.toString.call(val).slice(8,-1).toLocaleLowerCase()
			if(gettype !== 'object'){
				return gettype
			}else{
				return val.constructor.name.toLocaleLowerCase()
			}
		}
	}else{
		return false
	}
}
let arr=[1,2,3,4,5]
log(arr,'color:orange',true)

console (opens new window)