14个你可能不知道的JavaScript调试技巧

var func1 = function() {

func2();

}

var func2 = function() {

func4();

}

var func3 = function() {

}

var func4 = function() {

car = new Car();

car.funcX();

}

var Car = function() {

this.brand = ‘volvo’;

this.color = ‘red’;

this.funcX = function() {

this.funcY();

}

this.funcY = function() {

this.funcZ();

}

this.funcZ = function() {

console.trace(‘trace car’)

}

func1();

24行将输出：

可以看到 func1 调用 func2， func2 调用 func4。 Func4 创建了一个 Car 的实例，然后调用函数 car.funcX，依词攀类推。

即使你认为本身的代码写的异常好，这依然很有效。假如你想改进本身的代码。获取跟踪信息和所有涉及的函数，每一项都可以点击，可以在他们之间往返切换。就像是给你供给了一个调用客栈的选择列表。

7. 将代码格局化后再调试JavaScript

有时代码会在临盆情况出问题，然则你的source maps没有安排在临盆情况上。不要怕。Chrome可以将您的JavaScript文件格局化。格局化后的代码固然不像真实代码那样有效，但至少可以看到产生了什么。点击 Chrome控制台中的源代码查看器中的{}按钮即可。

13. Postman 很棒(但Firefox更快)

假设你要在函数中打断点，最常用的两种方法是：

在控制台查找行并添加断点
在代码中添加debugger

在这两个解决筹划中，您必须在文件中单击声调试特定行。

应用控制台打断点可能不太常见。在控制台中应用debug(funcName)，当达到传入的函数时，代码将停止。

这个调试办法很快, 但缺点是不实用于私有或匿名函数。但除了私有和匿名函数, 这可能是找到调试函数的最快办法。(留意：这个函数和console.debug函数不是同一个器械。)

有时，有一组复杂的对象要查看。可以经由过程console.log查看并滚动浏览，亦或者应用console.table展开，更轻易看到正在处理的内容!

var func1 = function() { 
  func2(); 
}; 
 
var Car = function() { 
  this.funcX = function() { 
    this.funcY(); 
  } 
 
  this.funcY = function() { 
    this.funcZ(); 
  } 
} 
 
var car = new Car();

在控制台中输入debug(car.funcY)，当调用car.funcY时，将声调试模式停止：

2/4 首页上一页 1 2 3 4 下一页尾页

　　推荐阅读

　　机房配电柜、配电箱在安装时应该注意哪些“禁忌”

媒介：机房配电柜配电箱经常会出现一些问题，而大年夜多半问题的根源都是在安装过程中操作欠妥，导致问题频发>>>详细阅读

本文标题：14个你可能不知道的JavaScript调试技巧

地址：http://www.17bianji.com/lsqh/38584.html

1/2 1