JavaScript 控制台方法:开发者速查表
由 Mux 主办的 DEV 全球展示挑战赛:展示你的项目!
Javascript 控制台对象是一个全局对象,它提供对浏览器调试控制台的访问。
我们大多数人都使用过 console.log() 函数将消息打印到控制台。但是,还有许多其他方法可以帮助我们轻松地调试代码。
事不宜迟,让我们来学习一下控制台方法。
信息()
它类似于 log(),但用于打印信息消息。
console.info("Hello World");
警告()
它用于打印警告信息。它会打印一条彩色(黄色)警告信息,通常用于指示某些地方出了问题。
console.warn("Hello World");
错误()
它用于打印错误信息。它会打印一条彩色(红色)错误信息,通常用于指示出现了问题。
console.error("Something went wrong");
桌子()
它用于打印表格数据,有助于以表格形式可视化数据。
const user = {
name: "John",
age: 30,
};
console.table(user);
时间()
它用于打印自调用 time() 方法以来经过的时间。这有助于了解某个操作需要多长时间。
console.time("TIME");
for (let i = 0; i < 1000000; i++) {}
console.timeEnd("TIME"); // TIME: 2.655029296875ms
清除()
它用于清空控制台。当您想在打印新消息之前清空控制台时,它非常有用。
console.log("Old Message");
console.clear();
console.log("New Message"); // New Message
dir()
它用于打印对象的属性。查看对象的属性很有用。
console.log(document.body); // <html>....</html>
console.dir(document.body); // body{...}
断言()
它用于在断言失败时打印错误消息。它可用于检查某个条件是否为真。
console.assert(1 === 2, "1 is not equal to 2"); // Assertion failed: 1 is not equal to 2
console.assert(1 !== 2, "1 is not equal to 2"); // nothing
数数()
它用于打印函数被调用的次数。查看函数被调用的次数很有用。
const exec = (label) => console.count(label);
exec(); // default: 1
exec(); // default: 2
团体()
它用于打印一组消息。将消息分组在一起非常有用。
console.group("USER API");
console.log("Name: John");
console.log("Age: 20");
console.groupEnd();
console.group("PRODUCT API");
console.log("Name: Laptop");
console.log("Price: 20");
console.groupEnd();
轮廓()
它用于打印自调用 profile() 方法以来经过的时间。这有助于了解某个操作需要多长时间。
console.profile("PROFILE");
for (let i = 0; i < 1000000; i++) {}
console.profileEnd("PROFILE");
注意:要查看分析结果,您需要打开浏览器的分析器。
痕迹()
它用于打印调用堆栈。查看调用堆栈很有用。
function foo() {
console.trace("TRACE");
}
foo();
日志()
在控制台记录一条消息。
const greet = "Hello";
console.log("Hello World"); // Hello World
console.log("%s World", greet); // Hello World
console.log("%cHello %cWorld", "color: red", "color: green"); // Hello(red) World(green)
如果你还没读过,一定要读!
如何使用 AbortController 取消 Javascript API 请求
Rahul Sharma ・ 2022年4月9日
#javascript #webdev #frontend #html
来抓我吧
YouTube、 GitHub、 LinkedIn、 Medium、 Stackblitz、 Hashnode、 HackerNoon
文章来源:https://dev.to/devsmitra/javascript-console-methods-a-cheat-sheet-for-developers-44mc