iT邦幫忙

DAY 8
4

MIS2000Lab.的「HTML5 認證考試,從零開始」--菜鳥的30天馬拉松系列 第 8

MIS2000Lab.的「HTML5 認證考試,從零開始」#8-- JavaScript入門 (II)

  • 分享至 

  • xImage
  •  

上一篇文章 http://ithelp.ithome.com.tw/question/10157539
是很粗淺的入門

如果真要學習 JavaScript
手邊一定要有書本,隨時備查!

不可能用這種網路上的簡單文章,就能學會(更別說精通了!不可能)

這是初學者最容易犯的「迷思」:
*****************************************
經典好文 -- 讀書與上課
http://www.dotblogs.com.tw/billchung/archive/2010/11/28/19767.aspx

或許是網際網路太發達且資訊已經多到爆炸,
也許有人覺得要對一門電腦技術精通 只要上網查查資料、看看別人的部落格就有機會達成這樣的目標

我不否認應該有少數這樣具有特別天份的人,這類的人多半對於知識的組織與吸收是有獨到之處,
不過這也意味著 大部份的人 走這條路通常都會進到死胡同,
很快地將會遭遇許多技術瓶頸的挑戰。....詳見全文
*****************************************

本文開始:

====JavaScript變數的命名規則:====

  1. 必須是「英文字」或是「底線( _符號)」作為開頭字元。
  2. 變數名稱的英文大小寫有差別,不要混用。
  3. 不要使用類似的字來命名,例如valueOfAPPLE與ValueOfApple這兩個變數不同(大小寫有差別),但意思容易混淆。
  4. 良好的命名有助你將來為程式除錯,有意義的名字並用”大寫子母”區隔兩個單字(一目了然)。

==== 資料型態 規則:====

不像 .NET的C#或是VB語法有那麼多資料型態,JavaScript比較簡單,除了var之外只有三種資料型態。
 String(字串)
 Number(數值)
 Boolean(布林)

要提醒您:

  1. 明確的定義有助於將來的除錯,不然的話,JavaScript幫您(自動)轉換資料型態有可能出現「您想不到」的成果
  2. 定義了變數卻”不”給予預設值,可能會造成「undefined(未定義)」錯誤訊息。
  3. 您可以設定這個變數為null。但請您認真釐清null的定義,null表示這個值「不存在」而不是「沒有給予預設值」

(微軟認證教材的原文說明:Setting a variable to null indicates that a value does not exist, rather than that a variable has not been given a value.)。

==== 全域變數(Global Variable)與區域變數(Local Variable) ====

這裡是JavaScript跟我們常用的 Java / VB /C#差異比較大的地方,要小心

區域變數(local variable)
 在函數裡面(內部)進行宣告,”不”可以在函數”以外”的地方使用它。請在函數內部使用var幫變數命名。請看下圖範例的變數var_L1
 只能在宣告的函數裡面(內部)使用(這稱為local scope)。
 在”不同的函數”裡面,可以用var宣告”相同名稱”的區域變數。因為用var宣告的區域變數只有在函數內有效,所以不怕互相干擾。
 在宣告變數的函數運作完畢時,區域變數將被消失。

全域變數(global variable)
 在函數外面進行宣告,使用var幫變數命名。請看下圖範例的變數var_G3。
 整個網頁中的的程式都可以存取全域變數(global scope)。
 在“同一個網頁”裡面,”不能”宣告相同的全域變數名稱,不然的話,後面(新的)那個全域變數的值將會覆蓋掉前面(舊)那個的「值」。請看下圖範例最後的第二個「同名」全域變數var_G3。
 在網頁關閉時,全域變數將被消失。

下面的範例與執行成果,一看就清楚囉!
(所以,學習軟體、程式,沒範例又不動手做,真的只是紙上談兵!)

[img=415,252]http://ithelp.ithome.com.tw/upload/images/20141003/20141003004921542d821106d62_resize_600.jpg[/img]

==== 條件式(Conditional Statement)====

一圖解千言
我用下面這張圖片,讓大家知道 if 與 switch...case,其實在某些地方是一體兩面
互可替代的寫法

[img=415,396]http://ithelp.ithome.com.tw/upload/images/20141003/20141003004953542d823156e3f_resize_600.jpg[/img]

==== 迴圈 / 物件(Object)型態 ====

我用下面這張圖片,讓大家知道 for(數字型的迴圈) 與 while(條件型的迴圈),其實在某些地方是一體兩面
互可替代的寫法

[img=415,306]http://ithelp.ithome.com.tw/upload/images/20141003/20141003005010542d8242c71e0_resize_600.jpg[/img]

........................

........................
............鐵人賽 30天,

如果真要講 JavaScript,搞不好可以講到一百天喔
講多了也枯燥

更何況這系列是要做 HTML5與相關技術的,我暫時在此打住

我後來發現在 2014年三月就有把我寫好的章節,完全給大家試讀
您可以參考這兩篇文章,就是我 "完整"的章節內容:

給初學者的....JavaScript 入門 小學堂 #1

給初學者的....JavaScript 入門 小學堂 #2

這部分我有參考其他書籍進行補強,日後正式推出時,應該會不太一樣

還是要苦口婆心地說:
如果真要學習 JavaScript,手邊一定要有書本,隨時備查!
不可能用這種網路上的簡單文章,就能學會(更別說精通了!不可能)

不要走開,馬上回來

下一篇文章為您介紹網頁的DOMhttp://ithelp.ithome.com.tw/question/10158053

===============================================
本系列文章已經集結出書
HTML5、CSS、JavaScript 網頁程式設計與 MCSD 70-480 認證教材

MIS2000 Lab. 周棟祥/吳進魯

出版商:碁峰
出版日期:2015-04-09

語言:繁體中文
ISBN:9863475750
ISBN-13:9789863475750

PChome http://24h.pchome.com.tw/books/prod/DJAV0S-A90060ASI
博客來 http://www.books.com.tw/products/0010671214
天瓏書局 https://www.tenlong.com.tw/items/9863475750?item_id=1003110


上一篇
MIS2000Lab.的「HTML5 認證考試,從零開始」#7-- JavaScript入門 (I)
下一篇
MIS2000Lab.的「HTML5 認證考試,從零開始」#9-- DOM簡介
系列文
MIS2000Lab.的「HTML5 認證考試,從零開始」--菜鳥的30天馬拉松30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言