Javascript中Console蕴含的各种方法全解析

百度已收录   阅读次数: 200
2022-02-1011:40:43 发表评论
摘要

有关Javascript中的Console有很多种花样可以玩出来,什么?你只用Console.log,那就太out了,本篇文章就来将Console命令中的各种含义都来统统解释归纳一下,让人用得更明白,发挥出Console语令更大的功效……

Javascript中Console蕴含的各种方法全解析

开篇寄语

有关Javascript中的Console有很多种花样可以玩出来,什么?你只用Console.log,那就太out了,本篇文章就来将Console命令中的各种含义都来统统解释归纳一下,让人用得更明白,发挥出Console语令更大的功效。

前情提要

内容详情

在浏览器的控制台输入console.info(console)或者console.log(info),回车后,就能看到打印出以下内容:

Javascript中Console蕴含的各种方法全解析

包含了console类中的各种命令。

assert: ƒ assert()
clear: ƒ clear()
context: ƒ context()
count: ƒ count()
countReset: ƒ countReset()
debug: ƒ debug()
dir: ƒ dir()
dirxml: ƒ dirxml()
error: ƒ error()
group: ƒ group()
groupCollapsed: ƒ groupCollapsed()
groupEnd: ƒ groupEnd()
info: ƒ info()
log: ƒ log()
memory: MemoryInfo {totalJSHeapSize: 10000000, usedJSHeapSize: 10000000, jsHeapSizeLimit: 2190000000}
profile: ƒ profile()
profileEnd: ƒ profileEnd()
table: ƒ table()
time: ƒ time()
timeEnd: ƒ timeEnd()
timeLog: ƒ timeLog()
timeStamp: ƒ timeStamp()
trace: ƒ trace()
warn: ƒ warn()

1. console.log()

第一个也是最常见的命令是 console.log() 命令。它接收一条消息并将结果打印到控制台。它还可以打印 JavaScript 对象、数组——JavaScript 中的所有数据类型。此外,它还负责格式化结果的输出以使其更易于跟踪。

2. console.error()

开发人员使用 console.log() 命令完成他们所做的大部分事情 - 包括将错误记录到控制台。但是你知道有一个特殊的控制台命令吗?它是 console.error() 命令。它与 console.log() 命令非常相似,只是它将您登录的内容包装在一个红色错误框中。

Javascript中Console蕴含的各种方法全解析

3. console.info()

此控制台命令对于向控制台输出信息特别有用,建议用该命令替换。

4console.table()

这个命令可厉害了,最主要是很酷,能够输出一个表格,试举一例:

console.table(["orange", "apple", "grape"]);

打印效果如下图所示:

Javascript中Console蕴含的各种方法全解析

是不是很酷炫?

5. console.assert()

如果评估条件为假,此控制台命令将向控制台写入错误消息,试举一例:

console.assert(2 > 3, "It cannot be");

效果堪比console.error()

6. console.clear()

此命令会为您清除控制台。

7. & 8. console.group() and console.groupEnd()

这两个控制台命令可用于将控制台中的内容组合在一起。

console.group() 用于启动组。该组将继续运行,直到遇到 console.groupEnd()。

Javascript中Console蕴含的各种方法全解析

9. console.warn()

在控制台中记录警告应该很容易!这就是 console.warn 命令存在的原因,会出现黄色叹号的标识。

10 & 11. console.time() 和 console.timeEnd()

有时您需要测量完成操作所需的时间。对于这种情况,您可以使用 console.time() 和 console.timeEnd() 函数。

您可以使用 console.time() 来启动计时器并使用 console.timeEnd() 来停止计时器。

console.time();

for (let i = 0; i < 4; i++) {
  console.log("number " + i);
}

console.timeEnd();

生成效果如下图所示:

Javascript中Console蕴含的各种方法全解析

12. console.count()

console.count() 方法记录了这个对 count() 的特定调用被调用的次数。

试举一例:

let user = "";

function greet() {
  console.count(user);
  return "hi " + user;
}

user = "bob";
greet();
user = "alice";
greet();
greet();
console.count("alice");

打印出:

"bob: 1"
"alice: 1"
"alice: 2"
"alice: 3"

其他就不举例了,毕竟用的时候非常少。

分享至:
  • 我的微信
  • 微信扫一扫加好友
  • weinxin
  • 我的微信公众号
  • 扫描关注公众号
  • weinxin

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: