机械秒表的使用方法_让console.log()不再是你的唯一选项js日志输出6种方法

85fb06242ba6fb320c82fb5ca8f112c5.png

几乎所有的javascript开发者最常使用的日志打印调试api都是console.log(),其实还有很多的选项供我们选择,笔者下面就为大家一一介绍.

一、console.table()

console.table()是我非常建议大家去使用的方法,它可以接受JSON或数组并以表格格式打印,在对json对象和数组进行可视化打印的时候简单易用,结果直观。

比如下面的json数据对象使用console.table()打印

    console.table({
"id":"1",
"key":"value",
"count":2
});

控制台的输出结果如下:

3aa550f380c0dc36d431f5f36826f0b2.png

又比如对下面代码中的数组进行打印:

 console.table([
{
id: "1",
key: "value",
count: 2,
},
{
id: "2",
key: "value2",
count: 22,
},
{
id: "3",
key: "value3",
count: 5,
},
]);

控制台的输出结果如下:

e2ee572d470f0893f512b3f70e298e24.png

二、console.error()

console.error()相对于console.log()更有助于在调试时从输出日志中区分错误信息

bd501671e0f0d45b9e55a54919fd1eb3.png

从上图中可以看到,它的输出打印结果是红色的。

三、Time(time,timeLog,timeEnd)

console.time()、console.timeLog()、console.timeEnd() 这三个方法当我们对程序运行时间进行计时的时候特别有用。

参考下图理解这三个方法

9716f5ce801489ffc62d4eaf50c4e67e.png

  • console.time()相当于秒表中的开始按钮

  • console.timeLog()相当于秒表中的按圈计时/按点计时

  • console.timeEnd()相当于计时结束

console.time("ForLoop");
// "ForLoop" is label here
for (let i = 0; i < 5; i++) {
console.timeLog('ForLoop');
}
console.timeEnd("ForLoop");

控制台打印输出结果

a1a7b9d2e5f797a12fddad8c5fd92094.png

四、console.warn()

用黄色字体输出日志,更直观的方便的查看警告类日志信息。

3b3d65da8d91930e65cda14807fc8e7d.png

五、console.assert()

console.assert(assert_statement,message)用来设定断言,如果为false则显示message消息

if(3!=2){
console.error({ msg1: "msg1", msg2: "msg2" });
}
//上面的日志判断语句,可以简写为下面的断言
console.assert(3 === 2, { msg1: "msg1", msg2: "msg2" });

1a2a4c5eb0186531450b5087fe88ab01.png

另一种可以用来格式化输出的断言方式console.assert(assert_statement,message,args)

console.assert(false, "%d nd type for  %s ",2,"console.assert() method");

06fb78908cddc9480c94d4aef4749604.png

六、console.count()

console.count()特别适合用来计数,可以传递参数,可以根据根据参数标签统计次数。代码如下:

 for (let i = 0; i < 3; i++) {
console.count("label");
console.count();
console.count(i);
}

控制台打印输出的结果,类似于下面这样

 console.count()  console.count("label")   console.count(i)
default: 1 label: 1 0: 1
default: 2 label: 2 1: 1
default: 3 label: 3 2: 1
  • console.count()如果不传递参数,则使用默认的default标签。

  • console.countReset(标签参数)可以将指定标签的计数重置为0

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

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

相关文章

Git的安装(附安装包)

更多干货推荐可以去牛客网看看&#xff0c;他们现在的IT题库内容很丰富&#xff0c;属于国内做的很好的了&#xff0c;而且是课程刷题面经求职讨论区分享&#xff0c;一站式求职学习网站&#xff0c;最最最重要的里面的资源全部免费&#xff01;&#xff01;&#xff01;点击进…

【10.20校内测试】【小模拟】【无向图建树判奇偶环】【树上差分】

Solution 和后面两道题难度差距太大了吧&#xff01;&#xff01; 显然就只是个小模拟&#xff0c;注意判0就行了。 Code #include<bits/stdc.h> using namespace std;char s[100005];int main() {freopen("expression.in", "r", stdin);freopen(&qu…

微信(QQ)截图时,无法保留鼠标右键菜单选项内容

问题描述 按下右键后弹出菜单&#xff0c;再按下QQ截图热键"Ctrl&#xff0b;Alt&#xff0b;A"&#xff08;微信"Ctrl&#xff0b;A"&#xff09;时&#xff0c;却发现菜单不见了。 微信的解决方法 先按下"Alt"键不放&#xff0c;再按住&quo…

使用WebClient请求WCF REST服务

2019独角兽企业重金招聘Python工程师标准>>> 接上篇”WCF实现REST服务“&#xff0c;服务端有了&#xff0c;我们看看客户端怎么访问&#xff0c;由于JS跨域的限制&#xff0c;这里通过WebClient做在后台代理来访问&#xff0c;话不多说&#xff0c;直接上代码。 1…

Git的工作流程简介

目录Git的工作区域Git的基本流程1.将工作区的代码添加到暂存区2.将暂存区的文件提交到本地仓库3.将暂存区的文件提交到远程仓库Git的工作区域 Git的基本流程 图形化方式操作 命令行模式&#xff08;Linux系统常用&#xff09;操作 1.将工作区的代码添加到暂存区 查看文件状态使…

git常用配置(指令)

1、配置用户名和邮箱 (1) 指令设置 $ git config --global user.name "username" $ git config --global user.email johndoeexample.com (2) 修改配置文件.gitconfig 2、配置ssh key免密登录 (1) 生成密钥 $ ssh-keygen -t rsa -C 1046407517qq.com (2) 在github添加…

PG git pull

2019独角兽企业重金招聘Python工程师标准>>> remote: Counting objects: 347, done. remote: Compressing objects: 100% (159/159), done. remote: Total 159 (delta 136), reused 0 (delta 0) Receiving objects: 100% (159/159), 23.16 KiB, done. Resolving del…

c51单片机led奇数偶数亮_两STM32单片机串口通讯实验

一、实验思路连接两个STM32单片机的串口引脚&#xff0c;单片机A进行发送&#xff0c;单片机B进行接收。单片机B根据接收到单片机A的指令来点亮或熄灭板载LED灯&#xff0c;通过实验现象来验证是否通讯成功。二、实验器材两套STM32F103C8T6单片机开发板、ST-Link下载器、杜邦线…

Git本地仓库文件的创建、修改和删除

目录基本信息设置1.设置用户名2.设置用户名邮箱Git仓库操作介绍1.创建一个新的文件夹2.在文件内初始化git仓库&#xff08;创建git仓库&#xff09;3.向仓库中添加文件1.创建一个文件2.将文件添加到暂存区3.将暂存区添加到仓库4.修改仓库文件1.修改文件2.然后把文件添加到暂存区…

作业4

一.题目&#xff1a;求一个二维整数数组中最大子数组的和二.设计思想&#xff1a;假如有一个i行j列的二维数组&#xff0c;可以有正有负通过两个子函数实现(一.)通过上次的一位数组求最大值&#xff0c;可以先求出每一行最大连续子数组的和(二.)记下上下边界元素的下标(三.)每一…

C++的高效从何而来

2019独角兽企业重金招聘Python工程师标准>>> 前一段时间&#xff0c;实验室的一哥们突然跑过来跟我说&#xff0c;“我自己写了个C的快速排序&#xff0c;排了一个10000000个int的数组&#xff0c;貌似比C库中是qsort算法要快&#xff0c;咋回事&#xff1f;C的STL中…

Git本地仓库管理远程库(GitHub)——clone(下载)、commit(添加到本地仓库)、push(提交到远程仓库)、pull(拉取)操作

目录使用远程仓库的目的将本地仓库同步到git远程仓库1.克隆远程仓库(clone)2.新建一个文件3.将工作区的文件添加到暂存区4.将暂存区的文件添加到本地仓库(commit)5.提交(同步)到远程仓库(push)6.远程库拉取到本地库(pull)7.团队协作开发和跨团队协作开发(开源项目)使用远程仓库…

ps里面怎么插入流程图_学会这3个方法,5分钟能绘制出好看又高级的流程图

工作中&#xff0c;很多时候我们需要绘制流程图&#xff0c;有些小伙伴觉得流程图很难画&#xff0c;费时又耗力。那么今天小编就来给大家分享3种绘制流程图的方法&#xff0c;希望大家学会后&#xff0c;都能快速画出好看的流程图。下面就一起来看看吧~一、Excel绘制1.打开Sma…

oracle学习一二

最近在从事一个行业的测评项目&#xff0c;作为测评师来讲应当是正确的分工&#xff0c;有人负责网络安全测评&#xff0c;有人负责主机测评&#xff0c;有人负责管理测评等等。在测评一个oracle数据库的时候学习到了一点内容&#xff0c;在专业人士看来可能不足为奇&#xff0…

Github Pages 搭建个人网站

目录个人站点访问搭建步骤1.创建个人站点1&#xff09;.新建仓库2&#xff09;.填写仓库资料3&#xff09;.访问成功2.新建index.html文件1.&#xff09;点击 creat new file2.&#xff09;填写文件3&#xff09;.再次访问个人主页项目站点访问搭建步骤1.进入项目主页&#xff…

pwd命令是什么的缩写_手机学编程(2)目录管理命令

终端有两种类型&#xff1a;字符终端(CLI&#xff0c;命令行界面&#xff0c;通过键盘下达命令来要求系统帮我们做事情)和图形终端(GUI&#xff0c;图形用户界面&#xff0c;可通过鼠标下达命令来要求系统帮我们做事情)。Termux是一个字符终端&#xff0c;我们在提示符$后输入命…

Netty实现原理浅析

为什么80%的码农都做不了架构师&#xff1f;>>> 1、总体结构 先放上一张漂亮的Netty总体结构图&#xff0c;下面的内容也主要围绕该图上的一些核心功能做分析&#xff0c;但对如Container Integration及Security Support等高级可选功能&#xff0c;本文不予分析。…

如何上传文件夹到GitHub上(配图详解)

更多干货推荐可以去牛客网看看&#xff0c;他们现在的IT题库内容很丰富&#xff0c;属于国内做的很好的了&#xff0c;而且是课程刷题面经求职讨论区分享&#xff0c;一站式求职学习网站&#xff0c;最最最重要的里面的资源全部免费&#xff01;&#xff01;&#xff01;点击进…

cfg桩设备型号_什么是CFG桩?带您看下CFG桩施工工艺及流程,检测项目

一、CFG桩简介CFG(Cement Fly—ash Grave)桩是由水泥、粉煤灰、碎石、石屑或砂和水按一定配合比均匀搅拌形成的高粘结强度桩&#xff0c;和桩间土、褥垫层一起形成复合地基&#xff0c;既能较充分的发挥桩体材料的潜力&#xff0c;又可充分利用天然地基承载力&#xff0c;并能因…

django 修改日期

为什么80%的码农都做不了架构师&#xff1f;>>> http://blog.chedushi.com/archives/1389 auto_now无论是你添加还是修改对象&#xff0c;时间为你添加或者修改的时间。 auto_now_add为添加时的时间&#xff0c;更新对象时不会有变动。 转载于:https://my.oschi…