JavaScipt基本教程之JavaScript語言的基礎(chǔ)

更新時間：2008年01月16日 20:37:06 作者：

在什么地方插入 JavaScript
　　JavaScript 可以出現(xiàn)在 HTML 的任意地方。使用標記<script>…</script>，你可以在 HTML 文檔的任意地方插入 JavaScript，甚至在<HTML>之前插入也不成問題。不過如果要在聲明框架的網(wǎng)頁（框架網(wǎng)頁）中插入，就一定要在<frameset>之前插入，否則不會運行。
基本格式

<script>
<!--
...
(JavaScript代碼)
...
//-->
</script>

第二行和第四行的作用，是讓不懂<script>標記的瀏覽器忽略 JavaScript 代碼。一般可以省略，因為現(xiàn)在想找不懂 Script 的瀏覽器，恐怕就連博物館里也沒有了。第四行前邊的雙反斜杠“//”是 JavaScript 里的注釋標號，以后將學到。

另外一種插入 JavaScript 的方法，是把 JavaScript 代碼寫到另一個文件當中（此文件通常應該用“.js”作擴展名），然后用格式為“<script src="javascript.js"></script>”的標記把它嵌入到文檔中。注意，一定要用“</script>”標記。
參考 <script>標記還有一個屬性：language（縮寫lang），說明腳本使用的語言。對于 JavaScript，請用“l(fā)anguage="JavaScript"”。
參考相對于<script>標記，還有一個<server>標記。<server>標記所包含的，是服務器端（Server Side）的腳本。本教程只討論客戶器端（Client Side）的 JavaScript，也就是用<script>標記包含的腳本。
如果想在瀏覽器的“地址”欄中執(zhí)行 JavaScript 語句，用這樣的格式：
javascript:<JavaScript語句>
這樣的格式也可以用在連接中：
<a href="javascript:<JavaScript語句>">...</a>

JavaScript 基本語法
每一句 JavaScript 都有類似于以下的格式：
<語句>;
其中分號“;”是 JavaScript 語言作為一個語句結(jié)束的標識符。雖然現(xiàn)在很多瀏覽器都允許用回車充當結(jié)束符號，培養(yǎng)用分號作結(jié)束的習慣仍然是很好的。
語句塊語句塊是用大括號“{ }”括起來的一個或 n 個語句。在大括號里邊是幾個語句，但是在大括號外邊，語句塊是被當作一個語句的。語句塊是可以嵌套的，也就是說，一個語句塊里邊可以再包含一個或多個語句塊。

JavaScript 中的變量
什么是變量從字面上看，變量是可變的量；從編程角度講，變量是用于存儲某種/某些數(shù)值的存儲器。所儲存的值，可以是數(shù)字、字符或其他的一些東西。
變量的命名變量的命名有以下要求：
只包含字母、數(shù)字和/或下劃線；
要以字母開頭；
不能太長（其實有什么人喜歡使用又長又臭的名字呢？）；
不能與 JavaScript 保留字（Key Words，Reserved Words，數(shù)量繁多，不能一一列出；凡是可以用來做 JavaScript 命令的字都是保留字）重復。
而且，變量是區(qū)分大小寫的，例如，variable 和 Variable 是兩個不同的變量。不僅如此，大部分命令和“對象”（請參閱“對象化編程”章）都是區(qū)分大小寫的。
提示給變量命名，最好避免用單個字母“a”“b”“c”等，而改用能清楚表達該變量在程序中的作用的詞語。這樣，不僅別人能更容易的了解你的程序，而且你在以后要修改程序的時候，也很快會記得該變量的作用。變量名一般用小寫，如果是由多個單詞組成的，那么第一個單詞用小寫，其他單詞的第一個字母用大寫。例如：myVariable 和 myAnotherVariable。這樣做僅僅是為了美觀和易讀，因為 JavaScript 一些命令（以后將用更具體的方法闡述“命令”一詞）都是用這種方法命名的：indexOf；charAt 等等。
變量需要聲明沒有聲明的變量不能使用，否則會出錯：“未定義”。聲明變量可以用：

var <變量> [= <值>];

var 我們接觸的第一個關(guān)鍵字（即保留字）。這個關(guān)鍵字用作聲明變量。最簡單的聲明方法就是“var <變量>;”，這將為<變量>準備內(nèi)存，給它賦初始值“null”。如果加上“= <值>”，則給<變量>賦予自定的初始值<值>。

數(shù)據(jù)類型變量可以用的數(shù)據(jù)類型有：
整型只能儲存整數(shù)。可以是正整數(shù)、0、負整數(shù)，可以是十進制、八進制、十六進制。八進制數(shù)的表示方法是在數(shù)字前加“0”，如“0123”表示八進制數(shù)“123”。十六進制則是加“0x”：“0xEF”表示十六進制數(shù)“EF”。
浮點型即“實型”，能儲存小數(shù)。有資料顯示，某些平臺對浮點型變量的支持不穩(wěn)定。沒有需要就不要用浮點型。
字符串型是用引號“" "”、“' '”包起來的零個至多個字符。用單引號還是雙引號由你決定。跟語文一樣，用哪個引號開始就用哪個結(jié)束，而且單雙引號可嵌套使用：'這里是"JavaScript 教程"。' 不過跟語文不同的是，JavaScript 中引號的嵌套只能有一層。如果想再多嵌一些，你需要轉(zhuǎn)義字符：
　　轉(zhuǎn)義字符由于一些字符在屏幕上不能顯示，或者 JavaScript 語法上已經(jīng)有了特殊用途，在要用這些字符時，就要使用“轉(zhuǎn)義字符”。轉(zhuǎn)義字符用斜杠“\”開頭：\' 單引號、\" 雙引號、\n 換行符、\r 回車（以上只列出常用的轉(zhuǎn)義字符）。于是，使用轉(zhuǎn)義字符，就可以做到引號多重嵌套：'Micro 說："這里是\"JavaScript 教程\"。" '
布爾型常用于判斷，只有兩個值可選：true（表“真”）和 false（表“假”）。true 和 false 是 JavaScript 的保留字。它們屬于“常數(shù)”。
對象關(guān)于對象，在“對象化編程”一章將詳細講到。
由于 JavaScript 對數(shù)據(jù)類型的要求不嚴格，一般來說，聲明變量的時候不需要聲明類型。而且就算聲明了類型，在過程中還可以給變量賦予其他類型的值。聲明類型可以用賦予初始值的方法做到：

var aString = '';

這將把 aString 定義為具有空值的字符串型變量。

var anInteger = 0;

這將把 anInteger 定義為值為 0 的整型。
變量的賦值一個變量聲明后，可以在任何時候?qū)ζ滟x值。賦值的語法是：
<變量> = <表達式>;
其中“=”叫“賦值符”，它的作用是把右邊的值賦給左邊的變量。下一節(jié)將討論到表達式。

JavaScript常數(shù) 有下列幾個：

null 一個特殊的空值。當變量未定義，或者定義之后沒有對其進行任何賦值操作，它的值就是“null”。企圖返回一個不存在的對象時也會出現(xiàn)null值。
NaN “Not a Number”。出現(xiàn)這個數(shù)值比較少見，以至于我們可以不理它。當運算無法返回正確的數(shù)值時，就會返回“NaN”值。NaN 值非常特殊，因為它“不是數(shù)字”，所以任何數(shù)跟它都不相等，甚至 NaN 本身也不等于 NaN 。
true 布爾值“真”。用通俗的說法，“對”。
false 布爾值“假”。用通俗的說法，“錯”。

在 Math 對象中還有一系列數(shù)學常數(shù)。這將在討論“對象化編程”時談到。

表達式與運算符
表達式與數(shù)學中的定義相似，表達式是指具有一定的值的、用運算符把常數(shù)和變量連接起來的代數(shù)式。一個表達式可以只包含一個常數(shù)或一個變量。運算符可以是四則運算符、關(guān)系運算符、位運算符、邏輯運算符、復合運算符。下表將這些運算符從高優(yōu)先級到低優(yōu)先級排列：

括號	(x) [x]	中括號只用于指明數(shù)組的下標
求反、自加、自減	-x	返回 x 的相反數(shù)
	!x	返回與 x (布爾值)相反的布爾值
	x++	x 值加 1，但仍返回原來的 x 值
	x--	x 值減 1，但仍返回原來的 x 值
	++x	x 值加 1，返回后來的 x 值
	--x	x 值減 1，返回后來的 x 值
乘、除	x*y	返回 x 乘以 y 的值
	x/y	返回 x 除以 y 的值
	x%y	返回 x 與 y 的模（x 除以y 的余數(shù)）
加、減	x+y	返回 x 加 y 的值
加、減	x-y	返回 x 減 y 的值
關(guān)系運算	x<y x<=y x>=y x>y	當符合條件時返回 true 值，否則返回 false 值
等于、不等于	x==y	當 x 等于 y 時返回 true 值，否則返回 false 值
等于、不等于	x!=y	當 x 不等于 y 時返回 true 值，否則返回 false 值
位與	x&y	當兩個數(shù)位同時為 1 時，返回的數(shù)據(jù)的當前數(shù)位為 1，其他情況都為 0
位異或	x^y	兩個數(shù)位中有且只有一個為 0 時，返回 0，否則返回 1
位或	x\|y	兩個數(shù)位中只要有一個為 1，則返回 1；當兩個數(shù)位都為零時才返回零
位運算符通常會被當作邏輯運算符來使用。它的實際運算情況是：把兩個操作數(shù)（即 x 和 y）化成二進制數(shù)，對每個數(shù)位執(zhí)行以上所列工作，然后返回得到的新二進制數(shù)。由于“真”值在電腦內(nèi)部（通常）是全部數(shù)位都是 1 的二進制數(shù)，而“假”值則是全部是 0 的二進制數(shù)，所以位運算符也可以充當邏輯運算符。
邏輯與	x&&y	當 x 和 y 同時為 true 時返回 true，否則返回 false
邏輯或	x\|\|y	當 x 和 y 任意一個為 true 時返回 true，當兩者同時為 false 時返回 false
邏輯與/或有時候被稱為“快速與/或”。這是因為當?shù)谝徊僮鲾?shù)（x）已經(jīng)可以決定結(jié)果，它們將不去理會 y 的值。例如，false && y，因為x == false，不管 y 的值是什么，結(jié)果始終是 false，于是本表達式立即返回 false，而不論 y 是多少，甚至 y 可以導致出錯，程序也可以照樣運行下去。
條件	c?x:y	當條件 c 為 true 時返回 x 的值（執(zhí)行 x 語句），否則返回 y 的值（執(zhí)行 y 語句）
賦值、復合運算	x=y	把 y 的值賦給 x，返回所賦的值
賦值、復合運算	x+=y x-=y x*=y x/=y x%=y	x 與 y 相加/減/乘/除/求余，所得結(jié)果賦給 x，并返回 x 賦值后

注意所有與四則運算有關(guān)的運算符都不能作用在字符串型變量上。字符串可以使用 +、+= 作為連接兩個字符串之用。

提示請密切注意運算的優(yōu)先級。編程時如果不記得運算符的優(yōu)先級，可以使用括號( )。例如：(a == 0)||(b == 0)。

一些用來賦值的表達式，由于有返回的值，可以加以利用。例如，用以下語句：a = b = c = 10，可以一次對三個變量賦值。

語句
下面將開始討論 JavaScript 基本編程命令，或者叫“語句”。

注釋

像其他所有語言一樣，JavaScript 的注釋在運行時也是被忽略的。注釋只給程序員提供消息。

JavaScript 注釋有兩種：單行注釋和多行注釋。單行注釋用雙反斜杠“//”表示。當一行代碼有“//”，那么，“//”后面的部分將被忽略。而多行注釋是用“/*”和“*/”括起來的一行到多行文字。程序執(zhí)行到“/*”處，將忽略以后的所有文字，直到出現(xiàn)“*/”為止。

提示如果你的程序需要草稿，或者需要讓別人閱讀，注釋能幫上大忙。養(yǎng)成寫注釋的習慣，能節(jié)省你和其他程序員的寶貴時間，使他們不用花費多余的時間琢磨你的程序。在程序調(diào)試的時候，有時需要把一段代碼換成另一段，或者暫時不要一段代碼。這時最忌用 Delete 鍵，如果想要回那段代碼怎么辦？最好還是用注釋，把暫時不要的代碼“隱”去，到確定方法以后再刪除也不遲。

if 語句

if ( <條件> ) <語句1> [ else <語句2> ];

本語句有點象條件表達式“?:”：當<條件>為真時執(zhí)行<語句1>，否則，如果 else 部分存在的話，就執(zhí)行<語句2>。與“?:”不同的是，if 只是一條語句，不會返回數(shù)值。<條件>是布爾值，必須用小括號括起來；<語句1>和<語句2>都只能是一個語句，欲使用多條語句，請用語句塊。

注意請看下例：

if (a == 1)
  if (b == 0) alert(a+b);
else
  alert(a-b);

本代碼企圖用縮進的方法說明 else 是對應 if (a == 1) 的，但是實際上，由于 else 與 if (b == 0) 最相近，本代碼不能按作者的想法運行。正確的代碼是

if (a == 1) {
  if (b == 0) alert(a+b);
} else {
  alert(a-b);
}

提示一行代碼太長，或者涉及到比較復雜的嵌套，可以考慮用多行文本，如上例，if (a == 1) 后面沒有立即寫上語句，而是換一行再繼續(xù)寫。瀏覽器不會混淆的，當它們讀完一行，發(fā)現(xiàn)是一句未完成語句，它們會繼續(xù)往下讀。使用縮進也是很好的習慣，當一些語句與上面的一兩句語句有從屬關(guān)系時，使用縮進能使程序更易讀，方便程序員進行編寫或修改工作。

循環(huán)體

for (<變量>=<初始值>; <循環(huán)條件>; <變量累加方法>) <語句>;

本語句的作用是重復執(zhí)行<語句>，直到<循環(huán)條件>為 false 為止。它是這樣運作的：首先給<變量>賦<初始值>，然后*判斷<循環(huán)條件>（應該是一個關(guān)于<變量>的條件表達式）是否成立，如果成立就執(zhí)行<語句>，然后按<變量累加方法>對<變量>作累加，回到“*”處重復，如果不成立就退出循環(huán)。這叫做“for循環(huán)”。下面看看例子。

for (i = 1; i < 10; i++) document.write(i);

本語句先給 i 賦初始值 1，然后執(zhí)行 document.write(i)語句（作用是在文檔中寫 i 的值，請參越“對象化編程”一章）；重復時 i++，也就是把 i 加 1；循環(huán)直到 i<10 不滿足，也就是 i>=10 時結(jié)束。結(jié)果是在文檔中輸出了“123456789”。

和 if 語句一樣，<語句>只能是一行語句，如果想用多條語句，你需要用語句塊。

與其他語言不同，JavaScript 的 for 循環(huán)沒有規(guī)定循環(huán)變量每次循環(huán)一定要加一或減一，<變量累加方法>可以是任意的賦值表達式，如 i+=3、i*=2、i-=j 等都成立。

提示適當?shù)氖褂?for 循環(huán)，能使 HTML 文檔中大量的有規(guī)律重復的部分簡化，也就是用 for 循環(huán)重復寫一些 HTML 代碼，達到提高網(wǎng)頁下載速度的目的。不過請在 Netscape 中重復進行嚴格測試，保證通過了才好把網(wǎng)頁傳上去。作者曾試過多次因為用 for 循環(huán)向文檔重復寫 HTML 代碼而導致 Netscape“猝死”。IE 中絕對沒有這種事情發(fā)生，如果你的網(wǎng)也是只給 IE 看的，用多多的 for 也沒問題。

除了 for 循環(huán)，JavaScript 還提供 while 循環(huán)。

while (<循環(huán)條件>) <語句>;

比 for 循環(huán)簡單，while 循環(huán)的作用是當滿足<循環(huán)條件>時執(zhí)行<語句>。while 循環(huán)的累加性質(zhì)沒有 for 循環(huán)強。<語句>也只能是一條語句，但是一般情況下都使用語句塊，因為除了要重復執(zhí)行某些語句之外，還需要一些能變動<循環(huán)條件>所涉及的變量的值的語句，否則一但踏入此循環(huán)，就會因為條件總是滿足而一直困在循環(huán)里面，不能出來。這種情況，我們習慣稱之為“死循環(huán)”。死循環(huán)會弄停當時正在運行的代碼、正在下載的文檔，和占用很大的內(nèi)存，很可能造成死機，應該盡最大的努力避免。

break 和 continue

有時候在循環(huán)體內(nèi)，需要立即跳出循環(huán)或跳過循環(huán)體內(nèi)其余代碼而進行下一次循環(huán)。break 和 continue 幫了我們大忙。

break;

本語句放在循環(huán)體內(nèi)，作用是立即跳出循環(huán)。

continue;

本語句放在循環(huán)體內(nèi)，作用是中止本次循環(huán)，并執(zhí)行下一次循環(huán)。如果循環(huán)的條件已經(jīng)不符合，就跳出循環(huán)。

例

for (i = 1; i < 10; i++) {
  if (i == 3 || i == 5 || i == 8) continue;
  document.write(i);
}

輸出：124679。

switch 語句

如果要把某些數(shù)據(jù)分類，例如，要把學生的成績按優(yōu)、良、中、差分類，我們可能會用 if 語句：

if (score >= 0 && score < 60) {
  result = 'fail';
} else if (score < 80) {
  result = 'pass';
} else if (score < 90) {
  result = 'good';
} else if (score <= 100) {
  result = 'excellent';
} else {
  result = 'error';
}

看起來沒有問題，但使用太多的 if 語句的話，程序看起來有點亂。switch 語句就是解決這種問題的最好方法。

switch (e) {
  case r1: （注意：冒號）
    ...
    [break;]
  case r2:
    ...
    [break;]
  ...
  [default:
    ...]
}

這一大段的作用是：計算 e 的值（e 為表達式），然后跟下邊“case”后的 r1、r2……比較，當找到一個相等于 e 的值時，就執(zhí)行該“case”后的語句，直到遇到 break 語句或 switch 段落結(jié)束（“}”）。如果沒有一個值與 e 匹配，那么就執(zhí)行“default:”后邊的語句，如果沒有 default 塊，switch 語句結(jié)束。

上邊的 if 段用 switch 改寫就是：

switch (parseInt(score / 10)) {
  case 0:
  case 1:
  case 2:
  case 3:
  case 4:
  case 5:
    result = 'fail';
    break;
  case 6:
  case 7:
    result = 'pass';
    break;
  case 8:
    result = 'good';
    break;
  case 9:
    result = 'excellent';
    break;
  default:
    if (score == 100)
      result = 'excellent';
    else
      result = 'error';
}