javascript的controller层（JS-那些不了解的Console属性）

在日常的编码过程中，对于console属性知道得最多，用得最多的都是console.log属性，其实console也有其他许多不同的属性，分别有着不同的作用

• 接收两个参数，第一个参数是表达式，第二个参数是字符串。当第一个参数为false才会执行第二个参数

console.assert(assertion, msg); assertion：表达式，如果assertion为假，则会在控制台输出，msg为输出的内容。

• 清空控制台内容，光标返回第一行

console.clear()

• 用于统计打印的console数量，可以指定label（非必传），打印出指定label的数量

console.count([label]);

• 会在控制台出现一个红色查查图标显示信息

console.error();

• console.group用于展示分组，可以对信息做层叠操作，groupEnd则可以结束内联分组

console.group('第一层'); console.group('第二层'); console.log('error'); console.error('error'); console.warn('error'); console.groupEnd(); ----结束第一层 console.groupEnd(); ----结束第二层

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

console.groupCollapsed('第一层'); console.groupCollapsed('第二层'); console.log('error'); console.error('error'); console.warn('error'); console.groupEnd(); ----结束第一层 console.groupEnd(); ----结束第二层

• 打印信息

console.log() console.info()

• 将信息通过表格的形式打印出来

let tabelData = { a:{ data1: "1"}, b:{ data2: "2"}, c:{ data3: "3" } }

• 你可以console.time()启动一个计时器（timer）,并且通过console.timeEnd结束计时器， 从而得到某一个操作的操作时长

console.time() console.timeEnd()

• 打印该处的函数调用栈信息

console.trace

• 会在控制台出现一个黄色感叹号图标显示信息

console.wran()

• 打印显示一个对象的所有属性和方法

console.dir()

• 分析函数性能

console.profile() 执行函数 console.profile()

• 输出“调试”级别的消息且仅仅控制台配置为显示调试输出时才显示该消息
• 注意事项：谷歌浏览器和opera不支持该方法

console.debug()

• 使用console.memory（注意memory是console的属性，不是函数），来查看当前的堆的使用情况
• 注意事项：属性是不用（）触发的

console.menory

占位符 作用

%s 字符串

%d or % i整数

%f 浮点数

%o 可展开的DOM

%O 列出DOM的属性

%c 根据提供的css样式格式化字符串

几种常见用法

• %o、%O都是用来输出Object对象的，对普通的Object对象，两者没区别，但是打印dom节点时就不一样了：

- 格式成可展开的的DOM，像在开发者工具Element面板那样可展开 console.log('%o',document.body.firstElementChild); - 像JS对象那样访问DOM元素，可查看DOM元素的属性 - 等同于console.dir(document.body.firstElementChild) console.log('%O',document.body.firstElementChild);

• %c占位符是最常用的。使用%c占位符时，对应的后面的参数必须是CSS语句，用来对输出内容进行CSS渲染。常见的输出方式有两种：文字样式、图片输出。

console.log("%cHello world","color: red; font-size: 20px"); - 打印出的数据就有相应的样式，也可以通过样式来进行图片的打印

结语

熟悉并掌握这些并不那么常见的console方法，将其应用在日常工作中，能使调试更加的快速便捷。

,