簡介
在上一期當中，我們介紹了 node.js 的安裝與使用方式，文章連結如下：
在本期當中，我們將繼續介紹 JavaScript 的語法，包含控制邏輯與迴圈等等。
if 判斷
JavaScript 的 JavaScript If...Else Statements，和 C 語言幾乎一樣。舉例而言，下列程式可以根據 score 所設的定分數，來印出「及格」或「不及格」的訊息，只要大於 60 分，就算是及格了。
- 檔案：score.js
- #!/usr/bin/env node
- var score = 61;
- if (score >= 60)
- console.log("及格");
- else
- console.log("不及格");
底下為更完善的 if/else 範例:
- rank.js
- #!/usr/bin/env node
- var scores = [59, 61, 72, 83, 94]
- for(var i=0; i
- {
- if (scores[i] < 60)
- console.log(scores[i]+' 不及格');
- else if(scores[i] < 70)
- console.log(scores[i]+' 尚可');
- else if(scores[i] < 80)
- console.log(scores[i]+' 不錯');
- else if(scores[i] < 90)
- console.log(scores[i]+' 很好');
- else
- console.log(scores[i]+' 棒');
- }
兩種相等判斷
在 javascript 當中，比較特別的一件事情是，是否相等的判斷通常有兩種，一種是兩個等號的 `==` ，另一種是參個等號的 `===`。這兩種判斷到底差別在哪裡呢？答案是：三個等號者會判斷型態是否相等，因此是嚴格的相等，而兩個等號者不會判斷型態，因此是不嚴格的相等，以下範例說明了兩者的差異:
- equals.js
- #!/usr/bin/env node
- console.log('"30"==30 is ', "30" == 30);
- console.log('"30"!=30 is ', "30" != 30);
- console.log('"30"===30 is ', "30" === 30);
- console.log('"30"!==30 is ', "30" !== 30);
while 迴圈
JavaScript 的迴圈與 C 是非常像的，包含 while 與 for 語句都幾乎是一樣的。以下是一個 JavaScript 的 while 迴圈範例。
- while.js
- #!/usr/bin/env node
- i = 1;
- while (i <= 10)
- {
- console.log("i=", i);
- i = i + 1
- }
如果我們在從 1 數到 10 的過程當中，把變數 i 進行累加，那麼就可以得到累加總和， 1+..+10 = 55 的結果如下。
- whilesum.js
- #!/usr/bin/env node
- sum=0;
- i=1;
- while (i<=10) {
- sum = sum + i;
- console.log("i=", i, " sum=", sum);
- i = i + 1;
- }
for 迴圈
接著來看 JS For loop 範例:
- for.js
- #!/usr/bin/env node
- for (i=1;i<=10;i++) {
- console.log("i=", i);
- }
當然、同樣的事情也可以用 for 迴圈來做，這種寫法會更短更簡潔，以下是採用 for 進行 1+…+10 的範例:
- sum.js
- #!/usr/bin/env node
- sum=0;
- for (i=1;i<=10;i++) {
- sum = sum + i;
- console.log("i=", i, " sum=", sum);
- }
另外、 javascript 也從 C 語言那裏繼承了 continue 與 break 等語句，遇到 continue 時會回到迴圈開頭，忽略後面語句。而遇到 break 時則會跳出迴圈。
- forbreak.js
- #!/usr/bin/env node
- for (i=1;i<=10;i++) {
- if (i == 3) continue;
- if (i == 8) break;
- console.log("i="+i);
- }
陣列
JavaScript 的陣列宣告非常簡單，就是用 `[...]` 所框起來的一連串資料，或者您也可以用 `new Array()` 語句來建立一個空的陣列，而且可以用 length 屬性來取得陣列大小。
- array.js
執行結果:
當然、javascript 有些語法是 C 語言所沒有的，像是 JavaScript 的 foreach 語句採用 `for (i in c)` 這樣的語法，其中的 c 必須是個陣列或容器，而 i 則是索引值 (注意、不是內容，是索引值)，以下是這種語句的一個範例。
- foreach.js
- var a=[1,6,2,5,3,6,1];
- for (i in a) {
- console.log("a[%d]=%d", i, a[i]);
- }
字典 (物件)
雖然上述這些 JavaScript 的語法很像 C 語言，但是 JavaScript 本質上仍然是個動態語言，其特性比較像 Python、 Ruby 等語言，因此預設就有提供更高階的資料結構，其中最重要的一個就是字典 (dictonary)，字典中的基本元素是 (key, value) 的配對，我們只要將 key 傳入就可以取得 value 的値，以下是一個 JavaScript 的字典範例。
- dict.js
- var dict={ name:"john", age:30 };
- dict["email"] = "john@gmail.com";
- dict.tel = "02-12345678";
- for (var key in dict) {
- console.log("key=", key, " value=", dict[key]);
- }
- console.log("age=", dict.age);
- console.log("birthday=", dict["birthday"]);
- console.log("Before dict.tel=", dict.tel)
- delete dict.tel // Delete key='tel'
- console.log("After dict.tel=", dict.tel)
結語
在本章中，我們介紹了「變數、運算式、if 判斷式, for 與 while 迴圈」，還有「陣列與字典物件」等基礎語法，學會這些語法之後，就可以寫一些基礎的小程式了。 但是若要寫出更好、更模組化的程式，那就還需要學會「函數與物件導向」的寫法，這將是下一期的主題。
Supplement
* 後續 >> 用 Node.js 學 JavaScript 語言（3）函數、參數與閉包
* W3CSchool - JS While Loop
* W3CSchool - For Loop
* W3CSchool - JavaScript Arrays
* W3CSchool - JavaScript Array Methods
* JavaScript 核心 : 這些東西不簡單 (型態轉換)
* JavaScript 核心 : 這些東西不簡單 (物件)
* MDN web docs - Loops and iteration
沒有留言:
張貼留言