当我们开发项目时,JavaScript中的控制台对象是基础。
!️你可以去我的Github 查找JavaScript示例。 !️
![](https://i-blog.csdnimg.cn/blog_migrate/f67b981f67e8a21e163fc1239122f207.png)
如果我们在控制台标记中键入Google Chrome开发者工具,则单词: console 可以看到这是一个位于全局窗口对象内部的对象:
![](https://i-blog.csdnimg.cn/blog_migrate/1c0049af08ef1f5a1ce6902a18333cb6.png)
因此,您可以从窗口对象访问控制台对象。
window.console
但是没有必要 👓
让我们进一步了解她:
在控制台中打印:🔈
// Printing text
console.log('Hi!');
// Printing a variable
const PI = Math.PI;
console.log(PI);
// Expresions
console.log(2 + 4);
console.log(`PI value: ${PI}`);
// Comparing
console.log(null === undefined);
console.log(3 > 2);
console.log(typeof NaN);
console.log(true || false);
console.log(true && false);
// Ternary Operator
console.log( (3 > 2) ? 'Three!' : 'Two!');
结果: 📍
![](https://i-blog.csdnimg.cn/blog_migrate/a77ca442dfbe2998d0d368bb75ea6642.png)
打印错误:❌
console.error('Error!');
结果: 📍
![](https://i-blog.csdnimg.cn/blog_migrate/66c36ec9651c9ba9f59b96331a80009d.png)
打印警告消息:⚠️
console.warn('Be careful')
![](https://i-blog.csdnimg.cn/blog_migrate/72d3c35ca2e4b63a83ef3e9b08e037aa.png)
检查对象:🔦
console.dir(document);
console.dir({a: 5});
结果: 📍
![](https://i-blog.csdnimg.cn/blog_migrate/07dc99f7e037217964a04b5e7458c304.png)
断言:⛳
function isEqual(x, y) {
console.assert(
x === y, { "message": "x is not equal than y",
"x": x,
"y": y });
}
isEqual(10, 5);
![](https://i-blog.csdnimg.cn/blog_migrate/d12703cb3e8e1ea60148e1469a0add0f.png)
清除:⬜️
console.clear();
结果:控制台将为空。 📍
表输出:📋
const users = [
{name: 'Nick', age: 33},
{name: 'Jessica', age: 23}
];
console.table(users);
结果: 📍
![](https://i-blog.csdnimg.cn/blog_migrate/8a0f416cb7dfade0d5ee6be6a1f00620.png)
时间: 〽️
const users = [10, 20, 30];
console.time('performance');
const gThan10 = users.filter(n => n > 10);
console.log(gThan10);
console.timeEnd('performance');
结果: 📍
![](https://i-blog.csdnimg.cn/blog_migrate/523b6ba2b5e31e5533033ea42b77e54f.png)
组:📦
console.group('numbers');
console.log(1);
console.log(2);
console.log(3);
console.groupEnd('numbers');
![](https://i-blog.csdnimg.cn/blog_migrate/74e8508ef67be146f0357ff2a1c444b4.png)
谢谢😊!
From: https://hackernoon.com/discovering-the-console-in-javascript-8c5ff77ee846