console对象的方法log、info、warn、error的区别及几个实用的方法

先说一下console，JavaScript 原生中默认是没有 Console 对象，这是某些浏览器提供的内置对象。
在不同的浏览器里显示可能不同

下面的运行截图中，图中的灰色是运行的这句，灰色下面是此句运行的结果

log()、info()、warn()、error()区别

1、 log()和info()

这两个没区别，看别人有说info()前有个蓝色的图标，不过我使用的版本的谷歌浏览器运行时没有

因为没有运行出来，下面这张图是在网上偷的，地址：https://zhuanlan.zhihu.com/p/23080626。
下面会有堆栈内依次调用运行的方法名及其他等信息，有的浏览器是没有的

2、warn()和error()

warn()输出的log前有个黄色的图标
error()输出的log前有个红色的图标
这两个展开下面，会有堆栈内依次调用运行的方法名及其他等信息，除了颜色信息都是一样的

几个实用的方法

1、trace()

调试JavaScript程序时，使用console.trace()，不仅会打印函数调用栈信息，同时也会显示函数调用中各参数的值。

2、count()

可以把console.count()放在一个方法内，每次调用都会加1，更好显示方法被调用了多少次。

3、time()和timeEnd()

以ms为单位的时间，这两个要同时用，可以不写参数，输出的是，default：** ms
如果加了参数，参数要一致console.time(“count”);否则会报错，输出的是，count：** ms

4、assert()

一般两个参数，前面的是表达式，后面是要输出的内容，如果表达式为false，则输出

5、clear()

清空console的输出信息。

6、dir()

使输出内容格式化更易读，而且也会输出一个对象的全部属性和方法。

7、table()

数组格式

//var table = [
//     {"name": "小猪佩奇", "sex": "F"},
//     {"name": "小狗丹尼", "sex": "M"},
//     {"name": "小猫坎迪", "sex": "F"},
//     {"name": "小羊苏西", "sex": "F"},
//];
//这个键不一定是字符串类型的
var table = [{name: "小猪佩奇", sex: "F"},{name: "小狗丹尼", sex: "M"},{name: "小猫坎迪", sex: "F"},{name: "小羊苏西", sex: "F"}
];
console.table(table);

下面的图输出的是没有引号的，我只是表现上加了console.table("table");

对象格式

var table = {"一": {"name": "小猪佩奇", "sex": "F"},"二": {"name": "小狗丹尼", "sex": "M"},"三": {"name": "小猫坎迪", "sex": "F"},"四": {"name": "小羊苏西", "sex": "F"}
};
console.table(table);

console对象的方法log、info、warn、error的区别及几个实用的方法相关推荐

console对象的方法log()、info()、warn()、error()区别及几个实用的方法
先说一下console,JavaScript 原生中默认是没有 Console 对象,这是某些浏览器提供的内置对象. 在不同的浏览器里显示可能不同 log().info().warn().error( ...
js 控制台调试——console 对象【详解】
console对象是JavaScript的原生对象,用于与控制台窗口互动. console.log() 用于在console窗口输出信息. 可接受多个参数,并将结果连接起来输出. console.lo ...
ibm服务器安装ghostxp系统,windows xpsp3 ghost安装最实用的方法
windows xpsp3 ghost安装的方法有3种,分别是光盘安装法.U盘安装法跟硬盘安装法了.windows xpsp3 ghost安装的方法其实跟 win7 ghost安装方法是相似的.win ...
console 对象属性方法详解 log、info、warn、error的区别
参考: https://blog.csdn.net/S_clifftop/article/details/80363128?utm_medium=distribute.pc_relevant.none ...
JAVA中console方法怎么用_Java中Console对象实例代码
Java中Console对象实例代码发布于 2020-12-20| 复制链接摘记: 在JDK 6中新增了java.io.Console类,可以让您取得字节为基础的主控台装置,例如,您可以藉由Sys ...
Vue父组件调用子组件方法，报错[Vue warn]: Error in v-on handler: “TypeError: _this.$emit is not a function“
症状一开始浏览器控制台报这个错[Vue warn]: Error in v-on handler: "TypeError: _this.$emit is not a function&qu ...
HTML DOM Console对象
在开发过程中对程序进行测试,经常使用浏览器控制台输出相关信息,下面详细介绍console对象的相关方法. Console 对象提供了访问浏览器调试模式的信息到控制台 1. console.asser ...
浏览器兼容console对象的简要解决方案
不同浏览器或者版本之间对于console对象的支持不尽相同,而console方法在开发调试过程中都是不错的工具.难道要在上线前把所有console.xxxx去掉以保证某些浏览器不报错么.其实可以变通解 ...
js Console 对象 - Kaiqisan
js Console 对象ヤッハロー.Kaiqisanすうう.一つふつうの学生プログラマである, 昨天在玩webstorm的时候,在输入console.之后,它自动弹出很多其他方法,抱着好奇的心态, ...

console对象的方法log、info、warn、error的区别及几个实用的方法

log()、info()、warn()、error()区别

几个实用的方法

console对象的方法log、info、warn、error的区别及几个实用的方法相关推荐

最新文章

热门文章