javascript第二十讲：JavaScript调试及优化.pptVIP

1-* 北京源智天下科技有限公司 联系方式： 联系方式： 北京源智天下科技有限公司 第二十讲：JavaScript的调试与优化 讲师：杨贵 e-mail:jtclass@163.com / 课程内容安排 JavaScript开发工具 Javacript的调试 日志输出 代码优化 JavaScript开发工具 Microsoft Visual Studio 2005（下文简称VS2005） 是一套功能强大的开发套件，其对WEB开发也提供了强大的支持。 创建Web页 编辑Web页 Javacript的调试 调试前的准备工作：启用IE的调试功能。 打开IE浏览器，选择菜单栏“工具”|“Internet选项”命令，打开“Internet选项”对话框 。 单击“高级”选项卡，拖动“设置”列表框的垂直滚动条。在“设置”列表框中找到两个“禁用脚本调试”复选框，将它们前面的勾去掉。最后单击“确定”按钮确认修改并退出 开始调试 正确安装VS2005和设置IE浏览器后，可以开始调试JavaScript程序 。 在IE中打开包含JavaScript程序的HTML网页，选择菜单栏“查看”|“脚本调试程序”|“打开”命令，打“Visaul Studio实时调试引擎”对话框 。 在“可能的调试器”列表中选择一个调试器，例如选择“新实例Visual Studio 2005”，单击“是”按钮进入调试。 Javacript的调试 跟踪代码 ：调试的主要工作是反复地跟踪代码，找出错误并修正，可参考如下步骤。 在代码编辑器窗口中，将光标移动到需要添加断点的行上。 按一次F9键，当前行的背景色变为红色，并且在窗口左边界上标上红色的圆点。当程序在断点处暂停的时候，只要按一下F5、F10或F11键就可以继续向下执行，看具体的需要来操作。F10键逐过程执行，按F11键可以逐语句执行。 将鼠标移动源代码编辑窗口中的变量名上时，鼠标光标将显示变量当前时刻的值。点击变量信息框中的变量值可以修改变量的当前值。 更多的调试操作：查看调用关系、监视特定变量的值等。 日志输出 程序运行过程中，有些中间数据需要记录，以便检查程序运行的状态。 对于JavaScript记录中间数据通常是以日志的形式记录需要记录的数据，再发送到服务器上保存起来。 日志记录的内容可以是任意的信息，根据开发者的需要而定。 演示：范例20-2，日志输出。 代码优化 代码不但要给机器运行，同时也要供人阅读。因此，易于阅读的同时也要注意运行速度，尤其是脚本程序。 可读性 运行效率 针对诃读性而言。 “标识符短而含义清晰” “代码缩进对齐” “尽可能注释” “尽可能避免使用全局变量 ” function getMod( num, n ){if( typeof( num ) !==number ){return -1;}return num%n;} 难读： 代码优化 “尽可能注释” 下面是个很漂亮的注释。 01 /*---------------------------------------------------------------------------------------- 02 -名称：getMod 03 -功能：求余数 04 -参数：num,n 05 -num：为被除数 06 -n：除数 07 -返回：成功时返模值，失败时返回-1 08 ----------------------------------------------------------------------------------------*/ 09 function getMod( num, n ) // 取模函数 10 { 11 if( ( typeof( num ) != number) || 12 ( typeof( n ) != number ) ) // 检查参数是否都是数字 13 { 14 return -1; // 非数字则返回-1 15 } 16 return num%n; // 返回余数 17 } 代码优化 “代码缩进对齐” 可参考的缩进对齐方式。 缩进好，缺少注释。 01 function getMod( num, n ) // 无注释的程序片段 02 { 03 if( typeof( num ) !==number ) 04 { 05 return -1; 06 } 07 return num%n; 08 } 代码优化 与运行效率相关的优化 优化算法以求高效 ：针对所有的编程语言 调整代码的书写：针对解释执行方式的脚本程序语言 对象不再被使用时（也就是说没必须再