Java Script代码的简单调试方法
生活随笔
收集整理的這篇文章主要介紹了
Java Script代码的简单调试方法
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
JavaScript是解釋型代碼，代碼執行到哪里，才調試到哪里，不像是C/C++，可以進行編譯，鏈接，也不像是Python，進行預編譯。
調試有幾種方法：
方法1： 瀏覽器自帶的調試功能，我們這里使用Google Chrome舉例
例如下面的代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Debug</title>
</head>
<body>
<h1>This is a Test</h1>
<p id="p1">this is a test</p>
<script>
document.getElementById("p1").innerHTML="hello world" ；
</script>
</body>
</html>
我們希望將<p>標簽中的內容，從"this is a test", 修改成"hello world”
輸出如上圖，輸出結果仍然是“this is a test" ，并沒有改變成”hello, world"
這個時候在瀏覽器按 F12
選擇console窗口
有一個錯誤提示，“invalid or unexpected token"
這個錯誤一般是輸入了不識別的字符，仔細檢查代碼發現:11行輸入了中文”，“，而不是”;", 修改后，可以正常輸出了。
方法二： 使用alert方法
例如下面的代碼
<body>
<h1>This is a Test</h1>
<p id="p1">3</p>
<p id="p2">3</p>
<p id="p3"></p>
<script>
var a = document.getElementById("p1").innerHTML ;
var b = document.getElementById("p2").innerHTML ;
c = a+b;
document.getElementById("p3").innerHTML="a+b="+c ;
</script>
</body>
我們將P1，p2中的數字相加，顯示到P3當中去，輸出的結果是33：
這個并不是我們想要的結果，那我們想知道中間的結果是c到底是什么呢？
在代碼中添加alert("a+b");
會彈出窗口，將C的內容顯示出來，確實是33
為什么會出現這樣的現象呢，是因為解釋器將a和b解釋成了字符串對象，然后相加。
修改語句：c = parseInt(a)+parseInt(b);輸出正確的結果。
方法二： 使用console.log方法
如果程序體非常大，或者執行過程中，有一些中間值，我們需要查看，可以使用console.log的方法，這個信息，將打印到方法一中的console中，
例如：
<h1>This is a Test</h1>
<p id="p1">4</p>
<p id="p2">4! = </p>
<p id="p3"></p>
<script>
var a = document.getElementById("p1").innerHTML ;
var b = a-1
var c = a;
while (b>0){
a = a*b;
c = c.concat("x",b);
b = b-1;
console.log(c);
console.log("%d",a);
}
document.getElementById("p2").innerHTML=c ;
document.getElementById("p3").innerHTML=a ;
</script>
控制臺顯示的信息：
以上的三種方法，調試小程序是足夠了，可以發現代碼中的語法錯誤。
但是如果代碼中模塊和函數眾多，調用關系復雜的話，還是要寫測試用例來進行測試。
總結
以上是生活随笔為你收集整理的Java Script代码的简单调试方法的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Java断言(Assertion)
- 下一篇： 微信小程序上架需要增值电信业务经营许可证