2.11 注释
有的时候,当你思考编程的时候,会觉得自己理解程序中所进行的所有事情。代码的每一行都有意义,并且更好的是,它们还都能工作。但是,一个月或两个月以后,当你的老板或客户请你对自己所编写的漂亮脚本做一个更改或添加一项新功能的时候,你可能会看着似曾相识的JavaScript代码抓耳挠腮:这个变量的作用是什么?为什么我要这样写程序呢?程序的这一段做什么事情呢?
我们很容易忘记一个程序是如何工作的以及为什么按照这样的方式来编写代码。好在大多数编程语言为程序员提供了一种方法,使得他们可以给自己或其他阅读代码的人留下提示。JavaScript允许在代码中添加注释。如果你使用过HTML或CSS注释,那么也会熟悉JavaScript的注释。注释是一行或多行有用的提示JavaScript解释器忽略它们,但是它们对于程序如何工作可以提供有价值的信息。
JavaScript注释的语法和CSS相同。要创建单行注释,以双斜杠开始:
// this is a comment
我们也可以在一条JavaScript语句的后面添加注释:
var price = 10; // set the initial cost of the widget
JavaScript解释器执行一行中的每一项内容,直到它遇到//,然后它跳转到下一行的开始。
我们也可以使用/开始数行有用的注释,并且使用/结束它(这和CSS所使用的注释类型是一样的)。JavaScript解释器忽略两组符号之间的所有文本。例如,假设要在代码开始处描述一个程序如何工作,可以像下面这样做:
/*
JavaScript Slideshow:
This program automates the display of
images in a pop-up window.
*/
不需要让/*和*/都单独占一行。实际上,可以使用它们创建单独的一行JavaScript注释:
/* this is a single line comment */
通常,如果我们只是想要编写一个简短的、单行的注释,可以使用//。对于数行注释,使用/和/组合。
2.11.1 何时使用注释
对于相当长或复杂并且将来也会使用(并且可能修改)的程序来说,注释是很有价值的工具。尽管目前所学习的简单的脚本都只是一行或两行代码,但我们最终要创建较长或更复杂的程序。要确保可以快速搞清楚脚本在做什么,一种好办法是,添加注释以帮助理解程序的整体逻辑并说明任何特别容易混淆的地方或复杂的地方。
提示: 在脚本中添加太多的注释会使得脚本更大(并且下载起来更慢)。然而,我们将在14.7节了解到,有一些方法使得JavaScript文件更小且更快。
很多程序员在一个外部JavaScript文件的开始处添加一段注释。这些注释可以说明这段脚本是用来做什么的,表明脚本的创建日期(包括用于经常更新的脚本的一个版本号),并且提供版权信息。
例如,在jQuery库的JavaScript文件的开始处,可以看到这样一段注释:
/*!
* jQuery JavaScript Library v1.6.3
* http://jquery.com/
*
* Copyright 2011, John Resig
* Dual licensed under the MIT or GPL Version 2 licenses.
* http://jquery.org/license
*
* Includes Sizzle.js
* http://sizzlejs.com/
* Copyright 2011, The Dojo Foundation
* Released under the MIT, BSD, and GPL Licenses.
*
* Date: Wed Aug 31 10:35:15 2011 -0400
*/
在脚本的开始,可能还会包含如何使用脚本的说明:为了让脚本工作,可能需要设置的变量、可能需要对HTML所做的任何特定操作等。
也可以在一系列复杂的编程步骤之前添加一段注释。例如,假设编写一个脚本来实现访问者浏览器窗口中的图像动画。这段脚本的一部分是确定图像在浏览器窗口中的当前位置。这可能会占用数行复杂的程序,在这段程序前面添加注释是一个好办法,这样一来,当随后查看脚本的时候,就知道程序的这一部分到底干什么:
// determine x and y positions of image in window
在任何地方添加注释的首要基本原则是,你发现这些注释随后有用。如果一行代码十分显而易见,可能不需要注释。例如,为alert('hello')这样的简单代码添加注释,显然是没有什么理由的,因为它要做什么显而易见(打开一个警告框,其中显示单词“hello”)。
2.11.2 本书中的注释
在说明JavaScript的时候,注释也非常有用。在本书中,注释常常用来说明一行程序做什么,或者指明一条特定语句的结果。例如,我们可能看到如下注释,它展示了一条alert语句的结果:
var a = 'Bob';
var b = 'Smith';
alert( a + ' ' + b); // 'Bob Smith';
第三行以一个注释结束,该注释表明了当在Web浏览器中预览这段代码的时候会看到什么内容。在阅读本书的时候,如果想要测试代码,可以将它们添加到一个Web页面并且在Web浏览器中查看,在把代码输入Web页面的时候,可以省略注释。这些类型的注释只是在你阅读本书的时候用来帮助你理解代码中发生了什么。
随着开始学习JavaScript中更为复杂的命令,将会开始操作变量中的数据。我们将会常常看到本书中的代码注释用来指出在命令运行后变量中应该存储的是什么。例如,charAt()命令允许选择字符串中特定位置的一个字符。当在本书中读到如何使用这些命令的时候,可能会看到如下所示的代码:
var x = "Now is the time for all good programmers.";
alert(x.charAt(2)); // 'w'
出现在第二行末尾的注释// 'w'表明:如果代码实际在一个Web浏览器中运行的话,我们会在警告对话框中看到什么(没错,'w'是对的,字符串像数组一样,因此,一个字符串的第一个字母的索引位置为0,因此,charAt(2)从字符串中获取第三个字符。有时候,编程只是伤脑筋)。