Java Script代码的简单调试方法
JavaScript是解釋型代碼，代碼執(zhí)行到哪里，才調(diào)試到哪里，不像是C/C++，可以進(jìn)行編譯，鏈接，也不像是Python，進(jìn)行預(yù)編譯。
調(diào)試有幾種方法：
方法1： 瀏覽器自帶的調(diào)試功能，我們這里使用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>標(biāo)簽中的內(nèi)容，從"this is a test", 修改成"hello world”
輸出如上圖，輸出結(jié)果仍然是“this is a test" ，并沒(méi)有改變成”hello, world"
這個(gè)時(shí)候在瀏覽器按 F12
選擇console窗口
有一個(gè)錯(cuò)誤提示，“invalid or unexpected token"
這個(gè)錯(cuò)誤一般是輸入了不識(shí)別的字符，仔細(xì)檢查代碼發(fā)現(xiàn):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中的數(shù)字相加，顯示到P3當(dāng)中去，輸出的結(jié)果是33：
這個(gè)并不是我們想要的結(jié)果，那我們想知道中間的結(jié)果是c到底是什么呢？
在代碼中添加alert("a+b");
會(huì)彈出窗口，將C的內(nèi)容顯示出來(lái)，確實(shí)是33
為什么會(huì)出現(xiàn)這樣的現(xiàn)象呢，是因?yàn)榻忉屍鲗和b解釋成了字符串對(duì)象，然后相加。
修改語(yǔ)句：c = parseInt(a)+parseInt(b);輸出正確的結(jié)果。
方法二： 使用console.log方法
如果程序體非常大，或者執(zhí)行過(guò)程中，有一些中間值，我們需要查看，可以使用console.log的方法，這個(gè)信息，將打印到方法一中的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>
控制臺(tái)顯示的信息：
以上的三種方法，調(diào)試小程序是足夠了，可以發(fā)現(xiàn)代碼中的語(yǔ)法錯(cuò)誤。
但是如果代碼中模塊和函數(shù)眾多，調(diào)用關(guān)系復(fù)雜的話，還是要寫(xiě)測(cè)試用例來(lái)進(jìn)行測(cè)試。
總結(jié)
以上是生活随笔為你收集整理的Java Script代码的简单调试方法的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： Java断言(Assertion)
- 下一篇： 微信小程序上架需要增值电信业务经营许可证