JavaScript 教學筆記 (1) - 基本語法概念

一般我們在撰寫 JavaScript 的時候會有兩種的方式,一是直接寫在 HTML 檔案內使用 script 標籤包起來,另一種則是另外寫在 js 檔案中然後在 HTML 按中引用 js 檔案。 第一種寫法 <script type="text/ja...

一般我們在撰寫 JavaScript 的時候會有兩種的方式,一是直接寫在 HTML 檔案內使用 script 標籤包起來,另一種則是另外寫在 js 檔案中然後在 HTML 按中引用 js 檔案。
第一種寫法
    <script type="text/javascript">
        JavaScript 程式碼內容
    </script>

第二種寫法
<script type="text/javascript" src="js檔案的相對路徑或絕對路徑"></script>


以上兩種的寫法都可以正確的載入 JavaScript 並執行,只是使用的時機不相同而已,第一種的使用時機是在撰寫簡短的程式碼並沒有太多的邏輯運算,且該段程式碼並不會被其他頁面所使用到,第二種寫法則是適合較為複雜的程式碼,並且於其他頁面同樣會使用到的程式碼,這樣可以減少程式碼重複撰寫的問題。
※備註:script 標籤中的 type 屬性是早期有其他語言的 script 也同時經常使用因此需要指定 type,而目前瀏覽器都以將期預設使用 text/javascript ,且 HTML 5 中 script 的 type 屬性也是預設為 text/javascript ,因此現在都可以直接使用 script 標籤即可不需要再添加 type 屬性

註解
在 JavaScript 中的註解有兩種
  • 第一種:單行註解使用 // 雙斜線表是單行註解
    <script>
        //單行註解
    </script>

  • 第二種:多行註解使用 /* 以及 */ 包住文字來進行文字較多的多行註解
    <script>
        /*
        多行註解
        */
    </script>

請計得好的程式設計師一定要養成寫註解的習慣,寫註解不僅可以幫助之後追蹤程式碼時可以快速方便的知道該段程式碼的用途,也方便之後接手的維護人員能夠快速的了解該段程式碼的功能。

程式碼大小寫視為不同單字
在程式碼中定義的變數大小寫視為不同變數,而引用內建函數也同樣要注意大小寫的問題,若大小寫符合將會造成程式碼錯誤的問題。

  • 舉例:
    <script>
        var a =10;
        var A =20;
        
        document.write("變數 a:",a,"<br>");
        document.write("變數 A:",A,"<br>");
    </script>
執行結果:

變數 a:10
變數 A:20

分段
JavaScript 中是使用 ; 來作為該行敘述的結束,因此在敘述結束時記得一定要加上 ; 否則將有可能造成程式的錯誤。

舉例:正確使用分號

    <script>
        var a =10;        
        var func = function abc(){
            a = 20;
        }; //正確用分號結束 function 的敘述
        (function cde(){           
        }); 
        
        func();
        document.write("變數 a:",a,"<br>");
    </script>
執行結果:

變數 a:20

舉例:未正確使用分號

    <script>
        var a =10;        
        var func = function abc(){
            a = 20;
        } //省略用分號結束 function 的敘述
        (function cde(){           
        });
        
        func();
        document.write("變數 a:",a,"<br>");
    </script>

執行結果:不會顯示任何東西

這兩種寫法只有第一種正確使用分號的寫法可以被正確執行,而第二種寫法瀏覽器則會出現 JavaScript 執行錯誤訊息 func is not a function ,並標示錯誤地方是在 func() 呼叫函示這行。因此當敘述結束時請記得加上分號。

JavaScript 基本語法的概念就是如此的簡易

留言

名稱

中華電信,1,手機遊戲,47,比利時,1,生活札記,8,光世代,1,作弊模式,1,免費,1,系統資訊,1,防火牆,1,架站札記,56,疫苗,1,啤酒,1,軟體札記,77,部落格,1,盜連,1,程式札記,48,虛擬主機,3,暗黑破壞神,1,資料庫,11,資訊札記,9,遊戲札記,58,電腦遊戲,8,圖片壓縮,1,網路應用,44,課金,1,操作教學,3,餐廳,1,aapanel,2,Android,34,ASP.net,18,bootstrap,1,caesium,1,cloudflare,3,cpanel,1,DBeaver,1,dns,3,edge,1,hinet,1,https,1,IE,1,iis,1,iOS,48,JavaScript,18,lalaport,1,laravel,1,LINQ,1,MSSql,5,MySQL,9,netcore,1,Oracle,3,outlook,1,PHP,17,redis,1,route,1,RPG Maker,15,sourcetree,1,SSD,1,ssl,1,steam,1,ubuntu,1,Unity3D,4,VPS,3,webform,1,windows,2,winform,2,wordpress,36,
ltr
item
茂銓的網路札記: JavaScript 教學筆記 (1) - 基本語法概念
JavaScript 教學筆記 (1) - 基本語法概念
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3vVrAXA5fooTvcnclI9WjQLf54O4_mV4Uu2P9v3M1pWLb3tEjwaio-QgGq6qa84hJ0K_mltPuLBBT6MV2eXe_iOks8a2qR-Ij5t8ufw0kwB9SDP6rEDMmst9fDuIaATYoINs-bM9SAp-P/s1600/javascript.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3vVrAXA5fooTvcnclI9WjQLf54O4_mV4Uu2P9v3M1pWLb3tEjwaio-QgGq6qa84hJ0K_mltPuLBBT6MV2eXe_iOks8a2qR-Ij5t8ufw0kwB9SDP6rEDMmst9fDuIaATYoINs-bM9SAp-P/s72-c/javascript.png
茂銓的網路札記
https://www.mauchiuan.com/2015/12/javascript-tech-note-1-basic.html
https://www.mauchiuan.com/
https://www.mauchiuan.com/
https://www.mauchiuan.com/2015/12/javascript-tech-note-1-basic.html
true
1319490497453496749
UTF-8
載入全部文章 找不到任何文章 查看全部 閱讀更多 回覆 取消回覆 刪除 By 首頁 頁面 文章 查看全部. 推薦 標籤 彙整 搜尋 全部文章 找不到任何您所搜尋的文章 回首頁 星期日 星期一 星期二 星期三 星期四 星期五 星期六 週日 週一 週二 週三 週四 週五 週六 一月 二月 三月 四月 五月 六月 七月 八月 九月 十月 十一月 十二月 1月 2月 3月 4月 五月 6月 7月 8月 9月 10月 11月 12月 現在 一分鐘前 $$1$$ 分鐘前 一小時前 $$1$$ 小時前 昨天 $$1$$ 天前 $$1$$ 週前 5週前 追蹤者 追蹤 此高級內容已鎖定 第 1 步:分享到社交網絡 第 2 步:單擊您社交網絡上的鏈接 複製所有代碼 選擇所有代碼 所有代碼都已復製到您的剪貼板 無法複製代碼/文本,請按[CTRL]+[C](或Mac為CMD+C)複製 表格中的內容