console使用方法介绍

news2025/7/21 10:46:24

console是在写前端Javascript时经常会使用到,我平时使用最多的是console.log,相比大多数人也是如此吧!

下面一起来看一下强大的console吧!

01函数(属性)

包含如下函数 / 属性:memory、assert、clear、count、debug、dir、dirxml、error、exception、group、groupCollapsed、groupEnd、info、log、markTimeline、profile、profileEnd、table、time、timeEnd、timeStamp、timeline、timelineEnd、trace、warn。总计含有24个函数 / 属性。

02演示和说明

下面我们依次来演示和说明一下;

一、console.memory

注意:这是一个属性,并不是是函数,此属性是用来查看内存使用情况,如果我们使用过多的console.log()会占用大量的内存,导致浏览器出现卡死情况。

我们打开浏览器进入调试模式,在console一栏下输入:console.memory,执行回车。

二、console.assert

使用示例:

console.assert(false,'这是一行文字')

此函数是在第一个参数为假的时候会在控制台输出信息。

三、console.clear

清空控制台输出信息,此方法可以在程序最好执行,将console出的信息进行清除,进一步的增加程序的安全性。使用方式如下:

console.clear()

四、console.count

此函数为统计打印次数,使用示例如下:

for (var i = 0; i < 10; i++) {console.count("当前输出")}

五、console.debug

此函数作用与console.log作用相同,均为调试输出,目前谷歌浏览器和opera不支持console.debug(),在控制台中看不到效果。我们在IE浏览器中看一下效果。

console.debug("这是一行文字")

六、console.dir

console.dir(dom)

此函数作用与console.log作用效果相同,但是在我们打开节点时,两者之间变现的存在差异。在观察节点时dir的效果要明显的好于log。

七、console.dirxml

如果是一个html节点那么打印出来是dom节点,其他的打印同dir。

console.dirxml(dom)

八、console.error

错误输出,显示红色

console.error("这是一行文字")

九、console.exception ()

exception 在部分浏览器浏览器中是console.error 的别名,谷歌最新浏览器已经废弃。

十、console.group()

大多数 console 中要输出高级和复杂的东西。分组可以让你归纳这些。尤其是让你能使用嵌套。它擅长展示代码中存在的结构关系。

console.group('Loop');

十一、console.groupCollapsed()

功能上和 console.group 一样,但是分组块一开始是折叠的。它没有得到很好的支持,但是如果你有一个无意义的庞大的分组并想默认隐藏它,可以试试这个函数。

十二、console.groupEnd()

主要是和console.group()、console.groupCollapsed()相关结合使用。

十三、console.info()

与console.log()相同

十四、console.log()

用于在控制台输出信息,在调试中非常实用。

十五、console.markTimeline()

console.markTimeline() 方法是 console.timeStamp()的废弃形式。

十六、console.profile()

检测性能,找出性能瓶颈,效果比console.time()更好

十七、console.profileEnd()

配合console.profile()使用

十八、console.table()

以列表形式展示数据,这比只扔下原始的对象数组要更加整洁、看起来更改直观。

十九、console.time()

专门用于监测操作的时间开销的函数,也是监测 JavaScript 细微时间的更好的方式。

console.time();

二十、console.timeEnd()

配合console.time()使用

二十一、console.timeStamp()

该特性是非标准的,请尽量不要在生产环境中使用它!你可以选择用一个参数来作为时间戳标签,然后标记旁边就会显示这个标签。

二十二、console.timeline()

断点调试使用,此方法是 console.time() 的弃用形式。

二十三、console.timelineEnd()

配合console.timeline()使用

二十四、console.trace()

调试和查找问题使用,是非常高效的函数,效果比console.log()好很多,使用我们只能知道执行了哪一个基础库,并不知道执行的具体位置,而此方法显示一个跟踪,该跟踪显示了代码如何在特定点结束。

console.trace();

二十五、console.warn

以警告的形式输出信息,当出现大量的调试信息时,可以使用warn形式突出特定点位,便于排查错误位置,warn以黄色背景,并在输出文件前加叹号。在诸多信息中非常明显。

至此,已经将console的函数或方法做了简单的介绍和说明,部分的函数演示并未配图,如果错误欢迎指出、虚心受教。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/395202.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

2023年最新最全 VSCode 插件推荐

Visual Studio Code 是由微软开发的一款免费的、针对于编写现代Web和云应用的跨平台源代码编辑器。它包含了一个丰富的插件市场&#xff0c;提供了很多实用的插件。下面就来分享 2023 年前端必备的 VS Code 插件&#xff01; 前端框架 ES7 React/Redux/React-Native snippets …

洗地机哪个牌子比较好?家用洗地机推荐

洗地机是可以做到扫地的同时把地也拖了&#xff0c;可以做到高效清洁&#xff0c;减轻家务负担。还具有杀菌功能&#xff0c;不用担心拖完地之后地面还有细菌滋生啦&#xff0c;洗地机可以做到即洗即干&#xff0c;无需等待拖完地之后还潮湿不能走路&#xff0c;尤其对于木地板…

简述下 React 的事件代理机制?

React 并不会把所有的处理函数直接绑定在真实的节点上。而是把所有的事件绑定到结构的最外层&#xff0c;使用一个统一的事件监听器&#xff0c;这个事件监听器上维持了一个映射来保存所有组件内部的事件监听和处理函数。 当组件挂载或卸载时&#xff0c;只是在这个统一的事件…

LIN资料整理(一):LIN入门简介

目录 一、LIN是什么 1、LIN简介 2、LIN的适用场景 3、LIN协议版本 4、LIN的主从机节点、主从机任务与LIN总线特点 一、LIN是什么 1、LIN简介 LIN 是Local Interconnect Network 的缩写&#xff0c;是基于UART/SCI(Universal Asynchronous Receiver-Transmitter / Serial…

2023级社科院与杜兰大学金融管理硕士还有少量名额,期待与你共谱人生新篇章

我们都是平凡人&#xff0c;过着平凡的生活&#xff0c;但若能有所热爱有所坚持&#xff0c;便会发出自己的光芒。就像我们在社科院与杜兰大学金融管理硕士项目读研&#xff0c;通过更加系统的学习&#xff0c;不仅丰富了我们的知识&#xff0c;还提升了我们的思维&#xff0c;…

NB-IOT宣传这么多年,这次总算用好了吧

一、方案概述随着实体经济快速发展&#xff0c;石化、港口、货场、工地等区域规模日益扩大&#xff0c;厂区面积广阔、环境复杂、作业人员和车辆众多&#xff0c;如无法实时掌握工作人员状态及外来人员位置、外来车辆情况等问题&#xff0c;将存在非常大的安全隐患。今天小编介…

ChatGPT在工业领域的用法

在工业数字化时代&#xff0c;我们需要怎么样的ChatGPT&#xff1f; 近日&#xff0c;ChatGPT热度高居不下&#xff0c;强大的人机交互能力令人咋舌&#xff0c;在国内更是掀起一股讨论热潮。一时间&#xff0c;这场由ChatGPT引起的科技飓风&#xff0c;使得全球最顶尖科技力量…

notepad++学习小技巧

不要小瞧了notepadd 这个可是我们的cv好帮手。。。 实战1背景&#xff0c;我找一个同事要表结构 结果他给我了一个xml。顿时一懵&#xff0c;我也不知道为啥好像是从前端扣下来的。 建表我只需要 columnName, displayName当作是comment&#xff0c; dataTypeNamecolumnType借鉴…

【计算机视觉】Visual grounding系列

文章目录一、任务简介二、Visual grounding常用数据集与评估指标2.1 常用数据集2.2 评估指标三、Visual grounding主流做法一、任务简介 Visual grounding涉及计算机视觉和自然语言处理两个模态。 简要来说&#xff0c;输入是图片&#xff08;image&#xff09;和对应的物体描…

市场营销书籍推荐:《经理人参阅:市场营销》

要学好市场营销有什么好方法&#xff1f;答案是看书&#xff01;比起碎片化地去阅读一些文章或看一些相关视频&#xff0c;读书来得更实在些。倘若能静下心来好好读上一本系统性的市场营销书籍&#xff0c;学好营销管理将不会再是一件难事。然而&#xff0c;问题的关键是&#…

大模型分布式系统

背景&#xff1a;模型越来越大&#xff0c;训练复杂度越来越高&#xff0c;需要训练的时间也是越来越长。那么我们该如何在现有的硬件基础上对模型做训练呢。模型规模的扩大&#xff0c;对硬件&#xff08;算力、内存&#xff09;的发展提出要求。然而&#xff0c;因为 内存墙 …

2023年襄阳中级工程师职称评审通知出来了哟

襄阳市职称改革工作领导小组办公室关于做好2022年度襄阳市非公企业工程系列中级任职资格评审工作的通知 各县&#xff08;市、区&#xff09;人力资源和社会保障局&#xff08;职改办&#xff09;&#xff1a; 根据市职改办《关于做好2022年度全市职称评审工作的通知》&#x…

IT女神节(致敬中国IT界永远的女神严蔚敏-数据结构)

我们都知道程序数据结构算法。相信很多人都学过严蔚敏的数据结构的课程。作为一个码农&#xff0c;在这不管是3.7女神节&#xff0c;还是3.8妇女节。我觉得都有必要向这些教育界的老前辈致敬。今天我就梳理梳理&#xff0c;最经典的数据结构教材。 严蔚敏介绍&#xff08;来自…

HTML学习笔记入门到精通day01

零、 复习昨日 见代码 一、二阶段介绍 第一阶段 java基本语法 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-aY95CV7t-1678153713499)(D:\前锋学习笔记\笔记\image-20230307094126248.png)] 二、HTML 2.1 HTML概念 ​ 网页&#xff0c;是网站中的一…

MS python学习(7)

Managing Keys - dotenv Managing keys usage of .env module 项目地址&#xff1a;https://github.com/theskumar/python-dotenv Reads the key,value pair from .env and adds them to environment variable. 将key明文&#xff08;hard code&#xff09;形式写在script里…

java开发基础了解

Java 2023-03-07 1、开发工具 &#xff08;1&#xff09;jdk1.8 ,11,17,从11开始不免费 java纯面向对象------面向对象&#xff08;对象&#xff09;面向过程&#xff08;函数&#xff09;。就和JavaScript语言。 &#xff08;2&#xff09;Mysql8.0 &#xff08;3&#xff…

MySQL是怎样运行的——如何正确的使用索引

序言 下边我们将唠叨许多种让B树索引发挥最大效能的技巧和注意事项&#xff0c;不过大家要清楚&#xff0c;所有的技巧都是源自你对B树索引本质的理解&#xff0c;所以如果你还不能保证对B树索引充分理解&#xff0c;那么再次建议回过头把前边的内容看完了再来&#xff0c;要不…

TouchBoard 使用教程

一. 硬件采购: 其实我是想买原版的TouchBoard的,但是售罄了, 只能买国产的了,这是淘宝唯一一家提供技术支持的店铺(下面的库文件直接找店家要就行) https://item.taobao.com/item.htm?spm=a21dvs.23580594.0.0.3c3a645epX97Bf&ft=t&id=706464470339 其他硬件…

Day10-网页布局实战CSS3

一 补充 1 画三角形 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content"IEedge"><meta name"viewport" content"widthdevi…

WebAuthn无密码身份验证技术

背景WebAuthn全称是Web Authentication API&#xff0c;是由W3C和FIDO在 Google、Mozilla、Microsoft、Yubico 等公司的参与下编写的规范。WebAuthn是一组在服务器、浏览器和身份验证器之间启用无密码身份验证技术。一般使用非对称加密技术&#xff0c;用公钥代替传统的密码&am…