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

5.记录 console.logs 的数量


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


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


输出:


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


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


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


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


输出:


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


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


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


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


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


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


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


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

输出:


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


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

上一篇:MQ-RabbitMq部署安装配置


下一篇:Linux安装两个anaconda