
朋友们,美好的一天!
在本简短说明中,我想与您分享有关Console对象可以与console.log()一起使用的一些方法的信息。
方法的完整列表可以在
这里找到。
从言语到行动。 是的,将使用Chrome。
Console.debug()和console.info()
Console.debug()和console.info()用于向控制台输出参考消息,实际上,它们是console.log()的类似物。 console.debug()的功能之一是,仅当控制台配置为显示调试级别消息时才显示此方法显示的消息(对于Chrome,“详细信息”的“级别”选项卡中有一个选中标记)。
让我们创建一些对象:
const harry = { name: 'Harry', age: 28, married: false, job: 'developer', salary: 300, }, alice = { name: 'Alice', age: 23, married: false, job: 'manager', salary: 100, }, bob = { name: 'Bob', age: 32, married: true, job: 'tester', salary: 200 }
使用console.log(harry,alice,bob)在控制台中列出它们:

现在,使用console.debug()提供其他信息(“ \ n”是换行符的控制字符,开头的空格用于对齐):
console.debug( ' The first employee is', harry.name, '\n The second employee is', alice.name, '\n The third employee is', bob.name )
我们得到以下内容:

最后,使用console.info(),使用通配符(“%s”是字符串,“%d”是数字,“%s”是应用样式的指令):
console.info(' This is %c%s%c. \n He\'s %d years old. \n He\'s %s. \n He works as %s. \n His salary is %d.', 'font-size: 1.2em; font-weight: 600; color: deepskyblue; text-decoration: underline;', harry.name, '', harry.age, harry.married ? 'married' : 'not married', harry.job, harry.salary)
结果(请注意我们用%c包裹的“ Harry”):

Console.count()
Console.count()显示带有特定标签的方法调用的数量(在method参数中传递)。 要使用给定值重置计数器,请使用console.countReset()。
使用MDN进行了稍微修改的示例:
let user = '' function greet() { console.count(user) return 'hi ' + user } user = 'bob' greet() user = 'alice' greet() greet() console.count('alice')
我们看到以下内容:

就我个人而言,我无法使用这种方法,但是机会似乎很有趣。
Console.group()
Console.group()用于对消息进行分组(向右移动一级)。 可以给组命名。 要关闭组,请使用console.groupEnd()。 Console.groupCollapsed()与console.group()的功能相同,但是输出位于最小化的组中(我们使用之前创建的对象):
console.groupCollapsed('harry') console.log(harry.name) console.log(harry.age) console.log(harry.married) console.log(harry.job) console.log(harry.salary) console.groupEnd() console.groupCollapsed('alice') console.log(alice.name) console.log(alice.age) console.log(alice.married) console.log(alice.job) console.log(alice.salary) console.groupEnd() console.groupCollapsed('bob') console.log(bob.name) console.log(bob.age) console.log(bob.married) console.log(bob.job) console.log(bob.salary) console.groupEnd()
我们得到:

Console.table()
Console.table()在表中显示数据。
创建一个对象数组:
let staff = [{ name: 'Harry', age: 29, married: false, job: 'developer', salary: 'many', }, { name: 'Alice', age: 23, married: false, job: 'manager', salary: 'few' }, { name: 'Bob', age: 32, married: true, job: 'tester', salary: 'medium' } ]
使用console.log(东西)派生它:

不太清楚,同意。
现在使用console.table(东西):

完全不同。
Console.time()
Console.time()使用传递的参数中的名称启动计时器。 使用console.timeEnd()停止计时器。 要固定中间值,请使用console.timeLog():
console.time('time')
结果:

Console.trace()
Console.trace()打印堆栈跟踪。 它可以用来确定函数调用的顺序。
使用MDN进行了稍微修改的示例:
foo() function foo() {
结果:

自己从未使用过,但记下了笔记。
这就是我的全部。 一切顺利。