web控制台

Web 控制台是一个工具，主要用于记录与网页相关的信息，例如：网络请求、JavaScript 安全错误、警告、CSS 等。它使我们能够通过在网页内容中执行JavaScript 表达式来与网页交互

控制台的类型

  1. console.log()
  2. console.error()
  3. console.warn()
  4. console.clear()
  5. console.time()
  6. console.table()
  7. console.count()
  8. console.group()

console.log()

  1. 用于将输出信息打印到控制台，log() 可以放入任何类型
1
2
3
4
5
6
7
console.log('111');
console.log(111);
console.log(true);
console.log(null);
console.log(undefined);
console.log({a: 1});
console.log([1, 2]);

console.error()

  1. 用于将错误消息记录到控制台，默认情况下，错误消息将突出显示为红色
1
console.error('error');

console.warn()

  1. 用于将警告消息记录到控制台，默认情况下，警告消息将突出显示为黄色
1
console.warn('warn');

console.clear()

  1. 用于清除控制台信息
1
console.clear();

console.time() 和 console.timeEnd()

  1. 想知道一段代码或一个函数所需要花费的时间，都可以使用 JavaScript 控制台对象提供的 time() 和 timeEnd() 方法。关键是要有一个必须相同的标签，而里面的代码可以是任何东西（函数、对象、甚至直接 console.log() 都可以）
  2. 启动一个计时器来跟踪某一个操作的占用时长。每一个计时器必须拥有唯一的名字，页面中最多能同时运行 10,000 个计时器
1
2
3
console.time("forEach");
new Array(1000).map((item, index) => index * 2).forEach(item => console.log(item));
console.timeEnd("forEach");

console.table()

  1. 在控制台生成表格，输入数据必须是数组或对象
1
console.table({a: 1, b: 2, c: 3});

console.count()

  1. 调用时会将数组写入控制台
1
2
3
4
console.count(1); // 1: 1
for (let i = 0; i < 10; i++) {
    console.count(i);
}

console.group() 和 console.groupEnd()

  1. 控制台对象的 group() 和 groupEnd() 方法允许我们将内容分组到单独的代码块中，并且这些代码块将缩进。和 time() 和 timeEnd() 一样，它们也接受值相同的标签
1
2
3
4
5
6
7
8
9
console.group('group');

console.log('group001');
console.error('group002');
console.warn('group003');

console.groupEnd('group');

console.log('exit group');