7 个让你的 console.log() 输出脱颖而出的提示和技巧(02)

本文涉及的产品
日志服务 SLS,月写入数据量 50GB 1个月
简介: 7 个让你的 console.log() 输出脱颖而出的提示和技巧

5.记录 console.logs 的数量


如果你想知道一个组件被渲染了多少次或者一个函数被调用了多少次,可以使用 console.count() 方法。如果你希望计数器重新开始,则可以使用 countReset。


console.count("小海");
 console.count("小海");
 console.count("小海");
 console.count("小C");
 console.count("小S");
 console.count("小C");


输出:


image.png


6. 将数组或对象输出为表格


使用console.group()方法组织数组对象的输出。


const dogs = [
 { name: "小海", age: 5 },
 { name: "小C", age: 2 },
 { name: "小S", age: 8 },
 ];
 const cats = ["小拥", "小鲸", "小落"];      
 console.table(dogs);
 console.table(cats);


输出:


image.png


7. 字符串替换和模板文字


字符串替换还在使用吗?对于样式 console.log 是的。但这是它的处理方式:


const emoji = "🙈"
console.log("这个%s是我最爱的emoji!", emoji);


可能已经使用字符串替换来避免必须使用 + 将字符串添加在一起。


const emoji = "🙈"
console.log("这个" + emoji+ "是我最爱的emoji");


使用模板文字可以轻松输出如下:


const emoji = "🙈"
console.log(`这个${emoji}是我最爱的emoji`);

输出:


image.png


有兴趣的需要查找其他控制台方法,可以查看 MDN Web 文档

相关实践学习
日志服务之使用Nginx模式采集日志
本文介绍如何通过日志服务控制台创建Nginx模式的Logtail配置快速采集Nginx日志并进行多维度分析。
目录
相关文章
|
6月前
|
机器学习/深度学习 JavaScript 前端开发
你不知道的console.log用法
在JavaScript中,使用`console.log()`时,通过大括号能显示变量名和值。`console.table(data, columns)`用于格式化打印表格。常用方法包括:`console.log()`
56 0
|
7月前
|
JavaScript 前端开发 开发者
使用`console.log()`查看运行结果非常简单
【4月更文挑战第18天】使用`console.log()`查看运行结果非常简单
338 1
|
7月前
|
Web App开发 XML JavaScript
控制台 console.log() 的乐趣
控制台 console.log() 的乐趣
112 1
控制台 console.log() 的乐趣
|
7月前
|
Java Unix 程序员
log4j基础讲解
log4j基础讲解
59 0
log4j基础讲解
|
移动开发
5分钟教你使用 console.log 管理你的输出日志
5分钟教你使用 console.log 管理你的输出日志
152 0
控制台输出信息console.log()的用法总结
控制台输出信息console.log()的用法总结
207 0
console.log控制台里怎么输出图片
console.log控制台里怎么输出图片
161 0
console.log控制台里怎么输出图片
|
前端开发
还在console.log一把梭吗?console还有其他骚操作
相信很多童鞋在开发中都是使用console.log()进行调试,本篇文章介绍一下console对象中的一些其他方法,这里并不是常用的方法。
159 0
还在console.log一把梭吗?console还有其他骚操作
|
前端开发 API 对象存储
5分钟教你使用 console.log 输出五彩斑斓的黑
5分钟教你使用 console.log 输出五彩斑斓的黑
3532 0
5分钟教你使用 console.log 输出五彩斑斓的黑
|
JavaScript C语言
console.log(a + a++ * ++ a)到底输出什么?
前言 有些小伙伴可能看到这道题目就已经蒙圈了!甚至可能看不懂这道题目在干什么。其实这是一道比较考察基础的面试题,当你明白原理之后,你可能会感觉这道题也就那么回事,但是如果你没有思绪,那你可能觉得这道题很难。 今天我们就来彻底看看这到底在做什么妖!
519 0
console.log(a + a++ * ++ a)到底输出什么?