JavaScript30 Day 9

这是我在github 上发现的一个原生js挑战项目，由于是js小白，希望通过这次的项目加深对js的理解

第9天主要是一些关于js的调试技巧

console对象

console对象赋予了你访问浏览器控制台的权限。它允许输出字符串，数组和对象，这对调试代码很有帮助。console对象是window对象的一部分，被浏览器对象模型(BOM)所支持。（可以看一下MDN上对于console的介绍 ）

输出信息的常规方式

• log()
• info()
• error()
• warning()

    console.log('hello');

    // Interpolated
    console.log('Hello I am a %s string!', '💩');

    // warning!
    console.warn('OH NOOO');

    // Error :|
    console.error('Shit!');

    // Info
    console.info('Crocodiles eat 3-4 people per year');

控制台的输出

效果图.png

你可能已经注意到了错误的日志信息——它比其他的看起来更加显眼。它展示了info和warn都没有的红色背景和堆栈跟踪。不过，在 Chrome 中warn有一个黄色的背景。

这些视觉上的区别能让你快速区分控制台上的错误信息或者警告信息。

在字符串中使用占位符，并且用传递给该方法的其他参数替换占位符，从而完成字符串的替换

console.log('Hello I am a %s string!', '💩');
//Hello I am a 💩 string!

酷炫的调试方式

• assert()
  assert 有两个参数 — 如果第一个参数是假值，它将会展示第二个参数。

console.assert(false, 'That is wrong!');

• table()
  使用表格来显示数组或者对象。

• dir()

dir方法显示一个所传对象的可交互列表。

• time()
  time方法，像上面的group方法一样，也有两个部分。
  一个启动计时器的方法和一个停止它的方法。
  一旦计时器完成，将会以毫秒为单位输出总的执行时间。
  使用console.time('')启动一个计时器，使用console.timeEnd('')来停止计时。最多同时运行 10,000 个定时器。
  输出的内容看起来像这样：timer: 0.57ms
  当你需要快速做一个基准测试的时候，它非常的有用

 console.time('fetching data');
    fetch('https://api.github.com/users/wesbos')
      .then(data => data.json())
      .then(data => {
        console.timeEnd('fetching data');
        console.log(data);
      });

    console.table(dogs);

---

以上就是我在day9中学到的知识，这里我同样参考了soyaine的中文指南，感谢