前端console的基本用法

 1. `console.log()`

最常用的方法，用于输出普通信息。

 

 

console.log('Hello, World!');

console.log('Value:', 42);

 

 

 2. `console.info()`

与 `console.log()` 类似，通常用于输出信息性消息。

 

 

console.info('This is an info message.');

 

 

3. `console.warn()`

输出警告信息，通常以黄色背景显示。

 

 

console.warn('This is a warning message.');

 

 

4. `console.error()`

输出错误信息，通常以红色背景显示。

 

 

console.error('This is an error message.');

 

 

 5. `console.debug()`

输出调试信息，通常用于开发环境中。

 

 

console.debug('This is a debug message.');

 

 

6. `console.assert()`

如果断言为 `false`，则输出错误信息。

 

 

console.assert(1 === 2, '1 is not equal to 2');

 

 

 7. `console.clear()`

清空控制台。

 

 

console.clear();

 

 

8. `console.dir()`

以对象树的形式输出对象的属性。

 

 

console.dir(document.body);

 

 

9. `console.dirxml()`

以 XML/HTML 树的形式输出 DOM 元素。

 

 

console.dirxml(document.body);

 

 

10. `console.table()`

以表格形式输出数组或对象。

 

 

console.table([{name: 'Alice', age: 25}, {name: 'Bob', age: 30}]);

 

 

11. `console.time()`, `console.timeEnd()`

用于计时，输出代码执行时间。

 

 

console.time('Timer');

// Some code

console.timeEnd('Timer');

 

 

12. `console.timeLog()`

输出计时器的当前值。

 

 

console.time('Timer');

// Some code

console.timeLog('Timer');

// More code

console.timeEnd('Timer');

 

 

13. `console.trace()`

输出堆栈跟踪。

 

 

function foo() {

  console.trace('Trace');

}

foo();

 

 

14. `console.profile()`, `console.profileEnd()`

用于性能分析。

 

console.profile('Profile');

// Some code

console.profileEnd('Profile');

 

 

15. `console.memory`

查看内存使用情况。

 

console.log(console.memory);

 

 

16. 格式化输出

`console` 支持类似 `printf` 的格式化输出。

 

 

console.log('String: %s, Number: %d, Object: %o', 'Hello', 42, {key: 'value'});

 

 

17. 样式输出

可以使用 `%c` 来添加 CSS 样式。

 

 

console.log('%cStyled message', 'color: red; font-size: 20px;');

 

 

18. `console.timeStamp()`

在性能分析工具中添加时间戳。

 

 

console.timeStamp('Timestamp');