JavaScript语言调试技巧

痛定思痛。 2022-05-11 23:48 291阅读 0赞

**一 使用alert()语句进行调试**

1、介绍

当程序开发者不能定位程序发生错误引发的异常时，可以采用代码跟踪方式查找错误，这时可以将alert()语句放在程序的不同位置，用它来显示程序中的变量和函数返回值等。

语法：

alert();

</script>

alert()：弹出对话框方法。

2、代码

3、运行结果

![fef949a1-dc68-3c35-b176-4e47ea7ddae3.png][]

![53a0f1b0-7a3b-3e38-b00b-8e474442462c.png][]

![e5c9aeb3-d002-3607-b7a8-89623a4b9a1f.png][]

![d373c998-877e-3263-987b-605075657a09.png][]

4、运行说明

这种方式的缺点是在代码中嵌入太多alert()语句，当调试结束时，删除这些alert()语句将是一个庞大的工程。

**二 使用write()语句进行调试**

1、介绍

有时程序员希望将所有的调试信息以列表的方式放置在页面中，这时可以使用write()语句进行调试。

语法：

document.write();

</script>

write()：将信息写入页面中的方法。

2、代码

3、运行结果

开始执行3结束

**三 使用抛出自定义异常消息进行调试**

1、介绍

抛出自定义异常是调试JavaScript代码的最佳途径。其使用了try...catch...finally语句及throw机制。

语法：

try

throw(somestatements);

\}catch(exception)\{

alert(exception.message);

</script>

throw：抛出自定义异常关键字。

alert()：弹出对话框方法。

2、代码

<html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>抛出自定义异常</title>
    <script language="javascript">
    function test(num1,num2)
    {
     	try
     	{
     		if(arguments.length<2)
     		{  //如果参数个数小于两个
     			throw new Error("参数个数不够"); //抛出异常
     		}
     		if(num1/num2=="Infinity")
     		{ //第二个参数为0
    	 		throw new Error("被除数不可以为0") //抛出异常
     		}
     	}
     	catch(exception)
     	{
     		alert(exception.message);  //在catch区域弹出异常提示信息
     	}
    }
    </script>
    </head>
    <body>
    <script language="javascript">
    test(1); //在body区域调用函数
    test(1,0);
    </script>
    </body>
    </html>

3、运行结果

![f8fad0c9-72f4-38cb-9f51-5ee740de6f9c.png][]

![58b2cd1c-1eb2-38d3-b382-276a7910863c.png][]

[fef949a1-dc68-3c35-b176-4e47ea7ddae3.png]: /images/20220512/4b171f9a105143ec8d2d642430226fb5.png
[53a0f1b0-7a3b-3e38-b00b-8e474442462c.png]: /images/20220512/5d0861741122421faf0dc0de3636a462.png
[e5c9aeb3-d002-3607-b7a8-89623a4b9a1f.png]: /images/20220512/1914bf0b91494708b85531332d398dfd.png
[d373c998-877e-3263-987b-605075657a09.png]: /images/20220512/ace35903f1704fcfa56de99770fdce3d.png
[f8fad0c9-72f4-38cb-9f51-5ee740de6f9c.png]: /images/20220512/11154e667c114973aa2c9ab91682b3ae.png
[58b2cd1c-1eb2-38d3-b382-276a7910863c.png]: /images/20220512/a1f28181cfc045beb05d0a6b5ccd017d.png