掘金同款 console

水一篇

看完大概只须要一分钟

常常不当心在掘金打开开发者工具，映入眼帘的就是掘金的招聘广告了

哟，这里还有个箭头，点一下

能够，看起来很是有意思

这个console怎么写的还真的不知道，不过不要紧，扒他源码！

console.log("-----------")
this.outputGroup(["","掘金餐厅招前端厨师：","","地处望京，厨具先进，食材鲜美，朝十晚七，周六日均不营业。","","招牌菜有爆炒 Vue.js、红烧 Node.js、Chrome 炖 Extension、宫爆 Panfish……","","要求注意卫生，以作菜为乐，有精进厨艺之心；熟悉烹饪基础理论者优先，可开发新式菜肴者优先。","","简历注明「FROM_JUEJIN_CONSOLE」投至：webuster@xitu.io。"].join("\n"),"BUG 为什么迟迟不改？页面为什么加载失败？元素为什么难以对齐？这一切到底是人性的扭曲仍是道德的沦丧？")
console.log("-----------")}}
{key:"outputGroup",value:function(e,t){"function"==typeof console.groupCollapsed?(console.groupCollapsed(t),console.log(e),console.groupEnd()):(console.log(t),console.log("-----------"),console.log(e),console.log("-----------"))}}])

复制代码

主要就是这么一句 console.groupCollapsed(t),console.log(e),console.groupEnd()

而后去就是mdn，刷一哈api, 超连接

好像彻底没看懂的样子，那么就直接来个demo

代码以下：

console.groupCollapsed('这里是外面');
  console.log('这里是里面');
console.groupEnd();
复制代码

运行以下：

大概就是这样

若是你愿意的话，还能够这样：

ps:层数多了的话，确实还蛮恶心的

小区别：
  - console.group 默认是展开状态
  - console.groupCollapsed 默认是收起状态
复制代码

掘金餐厅这个后厨还能够的样子

that's all