console不光有log!!!

原创 qingyang117 随笔 技术随笔 382阅读 2017-06-29 11:55:25 举报

一直都没有缘由的就在使用console.log(),今天看别人代码突然看到了个console.time(),还有这种姿势?所以各种百度来解锁console

首先,console也是对象,但是是宿主对象,即由浏览器内置提供,所以是否浏览器对于每种console的解析是否相同,还是有待研究的。

既然是对象,那我们去console.log(console),截图如下

console.log(console)

可以看到log其实只是console对象下的一个方法而已,还有其它众多呢!

抄了些案例,全当学习!

console.assert(expression, object[, object...])
接收至少两个参数,第一个参数的值或返回值为false的时候,将会在控制台上输出后续参数的值。
console.assert(1 == 1, object); // 无输出,返回 undefined
console.assert(1 == 2, object); // 输出 object

console.count([label])
输出执行到该行的次数,可选参数 label 可以输出在次数之前
(function() {
for (var i = 0; i < 5; i++) {
console.count('count');
}
})();

console.dir(object)
将传入对象的属性,包括子对象的属性以列表形式输出
var obj = {
name: 'classicemi',
college: 'HUST',
major: 'ei'
};
console.dir(obj);

console.error(object[, object...])
用于输出错误信息,用法和常见的console.log一样,不同点在于输出内容会标记为错误的样式,便于分辨。

onsole.group
这是个有趣的方法,它能够让控制台输出的语句产生不同的层级嵌套关系,每一个console.group()会增加一层嵌套,相反要减少一层嵌套可以使用console.groupEnd()方法。

console.info(object[, object...])
此方法与之前说到的console.error一样,用于输出信息,没有什么特别之处。

console.table()
可将传入的对象,或数组以表格形式输出,相比传统树形输出,这种输出方案更适合内部元素排列整齐的对象或数组,不然可能会出现很多的 undefined。
var obj = {
foo: {
name: 'foo',
age: '33'
},
bar: {
name: 'bar',
age: '45'
}
};

var arr = [
['foo', '33'],
['bar', '45']
];

console.table(obj);
console.table(arr);

console.log(object[, object...])

console.profile([profileLabel])
这是个挺高大上的东西,可用于性能分析。在 JS 开发中,我们常常要评估段代码或是某个函数的性能。在函数中手动打印时间固然可以,但显得不够灵活而且有误差。借助控制台以及console.profile()方法我们可以很方便地监控运行性能。
function parent() {
for (var i = 0; i < 10000; i++) {
childA()
}
}

function childA(j) {
for (var i = 0; i < j; i++) {}
}

console.profile('性能分析');
parent();
console.profileEnd();

console.time(name)
计时器,可以将成对的console.time()和console.timeEnd()之间代码的运行时间输出到控制台上,name参数可作为标签名。
console.time('计时器');
for (var i = 0; i < 1000; i++) {
for (var j = 0; j < 1000; j++) {}
}
console.timeEnd('计时器');

console.trace()
用来追踪函数的调用过程。在大型项目尤其是框架开发中,函数的调用轨迹可以十分复杂,console.trace()方法可以将函数的被调用过程清楚地输出到控制台上。

console.warn(object[, object...])
输出参数的内容,作为警告提示。

占位符

字符(%s)、整数(%d 或 %i)、浮点数(%f)和对象(%o)

console.log('%s是%d年%d月%d日', '今天', 2014, 4, 15);
console.log('圆周率是%f', 3.14159);
var obj = {
name: 'classicemi'
}
console.log('%o', obj);

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复