1

常用的Console对象的属性

1. console.log()console.info()

  • 浏览器环境和Node环境下都可以正常输出,功能类似

2. console.warn()console.error()

  • 普通的分类输出,如果参数不为错误
  • 那么浏览器端发出警告信息和错误内容
  • 那么Node环境下输出的是普通正常内容

3. console.debug()

  • Node环境下console.debug()报错
  • 前端debug,可以使用chrome的插件Alt Devtools,在需要debug的地方,直接输入debugger就可以停在这里
  • 后端debug,直接使用npm下载node-inspector,使用时,直接在命令行输入node-inspector,打开浏览器,在需要debug的地方打断点

4. console.table()

  • 表格形式输出内容
  • 浏览器端以表格形式显示数据,并且显示数据及其原型

数据格式01

var user = {
    name: 'Sherry',
    age: 18,
    school: ['Beijing School', 'Shanghai School'],
}
console.table(user);

console.table01

数据格式02

var user = {
    name: 'Sherry',
    age: 18,
    school: {
        beijing: 'Beijing School',
        shanghai: 'Shanghai School'
    }
}
console.table(user)

console.table02

  • Node环境下console.table()报错

5. console.count()

  • 浏览器端,输出这个方法被调用了多少次

    • for循环里计数
    • 某一个function调用了多少次
    • 在全局调用将一直输出1
  • Node环境下console.count()报错

6. console.dir()

  • 对象形式输出内容
  • 浏览器端

    • 输入普通参数,结果就是输出参数的值,就是console.table()输出的去掉表格的部分
    • 以目录树的形式,显示 DOM 节点。参数可以为document或者document.body等DOM节点,输出DOM节点的属性
  • Node环境下输出普通的文本内容, 但是可以显示不同颜色
console.log('console.dir(user, {colors: true})');
var user = {
    name: 'Sherry',
    age: 18,
    school: {
        beijing: 'Beijing School',
        shanghai: 'Shanghai School'
    }
}
console.dir(user, {colors: true})

console.dir01

7. console.dirxml()

  • 浏览器DOM节点形式输出
  • 浏览器端

    • 输入普通参数,结果就是输出参数的值,就是console.table()输出的去掉表格的部分
    • 参数可以为document或者document.body等DOM节点,输出DOM节点的HTML的内容
  • Node环境下console.dirxml()报错

8. console.time()console.timeEnd()

  • 计算某个操作耗费的时间
  • 操作所花费的时间,浏览器端和Node环境下都可以使用,功能相同
console.time('for 1000000 times');
for(let i = 0; i < 1000000; i++){

}
console.timeEnd('for 1000000 times');

输出结果:for 1000000 times: 3.094ms

9. console.assert()

  • 条件判断形式输出内容
  • console.assert(<判断条件>, <条件为false时的输出>)作用就是进行条件判断,第一个参数为truefalse的判断条件,第二个参数是如果第一个参数为false时的输出,如果第一个参数为true,那么第二个参数不输出
  • 浏览器端和Node环境下都可以使用

karuru
329 声望64 粉丝