但它不是唯一的类型。消息可以被归类为information （其处理方式与console.log()相同）。
console.info(‘this is an information message’);
警告：
console.warn(‘I warned you this could happen!’);
错误：
console.error(‘I’m sorry Dave, I’m afraid I can’t do that’);
或不太重要的调试信息:
console.debug(‘nothing to see here - please move along’);
console.table()可以以更友好的格式输出对象的值。
const obj = {
propA: 1,
propB: 2,
propC: 3
};
console.table( obj );
或对象的数组:
const arr2 = [
{ a: 1, b: 2, c: 3 },
{ a: 4, b: 5, c: 6 },
{ a: 7, b: 8, c: 9 }
];
console.table( arr2 );
其他选项包括:
-
console.dir( obj )显示一个 JS 对象的交互式属性列表 -
console.dirxml( element )显示指定的HTML或XML节点的子代元素的互动树。 -
console.clear()清除控制台之前的所有信息。
3.过滤日志消息
浏览器以适当的颜色显示日志信息，但也可以进行过滤，以显示特定的类型。点击控制台窗格左上方的图标，就可以打开Chrome的侧边栏。
注意，console.debug()信息只有在查看 verbose 选项时才会显示。
4. 使用 printf-type 的信息
所有的日志类型都可以使用c 语言风格的printf消息格式，该格式定义了一个模板，其中包含一个变量被替换的%指示器。例如
console.log(
‘The answer to %s is %d.’,
‘life, the universe and everything’,
42
);
// The answer to life, the universe and everything is 42.
带样式的风格
console.log(
‘%cOK, things are really bad now!’,
`
font-size: 2em;
padding: 0.5em 2em;
margin: 1em 0;
color: yellow;
background-color: red;
border-radius: 50%;
`
);
控制台中的结果:
6. 使用类似测试的断言
类似于测试的console.assert()命令可以用来在条件失败时输出一个信息。可以用一个条件和一个或多个对象来定义断言，当该条件失败时输出，例如
console.assert(
life === 42,
‘life is expected to be’,
42,
‘but is set to’,
life
);
另外，也可以使用一个信息和替换值。
console.assert(
life === 42,
‘life is expected to be %s but is set to %s’,
42,
life
);
当条件失败时，这两个选项都会显示一个断言错误。
7. 运行堆栈跟踪
可以使用 console.trace() 输出构成当前执行点的所有函数调用的日志。
function callMeTwo() {
console.trace();
return true;
}
function callMeOne() {
return callMeTwo();
}
const r = callMeOne();
跟踪显示每次调用是哪一行，并且可以在控制台窗格中折叠或展开：
8. 组日志消息
打印日志时，可以在开头使用console.group( label ) 和结尾使用 console.groupEnd() 将日志消息分成命名组。 消息组可以嵌套和折叠或展开（console.groupCollapsed( label ) 最初显示处于折叠状态的组）：
// start log group
console.group(‘iloop’);
for (let i = 3; i > 0; i–) {
console.log(i);
// start collapsed log group
console.groupCollapsed(‘jloop’);
for (let j = 97; j < 100; j++) {
console.log(j);
}
// end log group (jloop)
console.groupEnd();
}
// end log group (iloop)
console.groupEnd();
9. 使用定时器
自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。
深知大多数前端工程师，想要提升技能，往往是自己摸索成长或者是报班学习，但对于培训机构动则几千的学费，着实压力不小。自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！
因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。
既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上前端开发知识点，真正体系化！
由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！
如果你觉得这些内容对你有帮助，可以扫码获取！！（备注：前端）
最后：
总结来说，面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气，但是我们可以在别的地方花更多时间，每个环节都提前做好准备。
面试一方面是为了找到工作，升职加薪，另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚，更重要的是在平时学习和工作中不断积累和坚持，把每个知识点、每一次项目开发、每次遇到的难点知识，做好积累，实践和总结。
里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！**
如果你觉得这些内容对你有帮助，可以扫码获取！！（备注：前端）
最后：
总结来说，面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气，但是我们可以在别的地方花更多时间，每个环节都提前做好准备。
面试一方面是为了找到工作，升职加薪，另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚，更重要的是在平时学习和工作中不断积累和坚持，把每个知识点、每一次项目开发、每次遇到的难点知识，做好积累，实践和总结。
扫一扫
49
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
