JavaScript入門教學看這裡!(7)if.else的使用

JavaScript入門教學看這裡!(7)if.else的使用

JavaScript教學文章又來囉!久違的第一篇文章,要教你的是:if,else,if else的使用時機!

if 條件式

在使用 JavaScript 編寫程式碼時, 若希望程式能依據不同的狀態,去加以執行不同的操作時,當然又需要使用條件陳述式(conditional statements)啦。

我們可以使用if 條件式敘述:當一個指定的條件成立(為真)時會執行的程式碼,用白話來說就是「當...條件成立時,則會執行...程式」。

if 條件式的 JavaScript 語法如下:
See the Pen JavaScript7-if-1 by Tedutw (@Tedutw) on CodePen.

前端工程師們可要記住了:只有當指定的條件成立時,程式碼才會執行。

下面為 if 條件式 的範例,聲明當「變數 Num1 小於 變數 Num2」的條件成立時,才會顯示「JavaScript其實不難啊!」。
See the Pen JavaScript7-if-3 by Tedutw (@Tedutw) on CodePen.


承上面的例子,當「變數 Num1 小於 變數 Num2」的條件不成立時,則程式會自動跳過要執行的代碼,不會顯示「JavaScript其實不難啊!」。如下所示:
See the Pen JavaScript7-if-4 by Tedutw (@Tedutw) on CodePen.

else 敘述

當條件不成立時,除了不讓程式執行之外,我們還可以選擇使用「else」語句來指定當不符合指定條件時,所要執行的動作。

請看看上方的例子:當不符合「變數 Num1 小於變數 Num2」 的狀況時,就顯示「前端工程師都必須學JavaScript」。
See the Pen JavaScript7-if-5 by Tedutw (@Tedutw) on CodePen.

 

else if 敘述

if 條件式 中,我們還可以加入「else if」敘述另一個條件,代表:當所指定的條件不成立時,是否還符合另一個條件?

如以下例子所示,當變數「age」大於 17 的條件成立時,則顯示「成人」;若不成立,則看看是否符合另一個條件(變數是否大於 11)。當另一個條件成立時,則顯示「青少年」;若兩個條件都不成立,就顯示「兒童」。
See the Pen JavaScript7-if-6 by Tedutw (@Tedutw) on CodePen.



相關文章:

JavaScript入門教學看這裡!(4)數學運算子

JavaScript入門教學看這裡!(5)賦值運算子

JavaScript入門教學看這裡!(6)邏輯運算子

擠進高薪科技大門-Java課程等你來瞭解!

2018前五大程式語言你都了解嗎? 除了Java課程還有哪些呢?

以Java課程的角度看C++,與眾不同的程式思維

美國NASDAQ上市公司、外商IT教育培訓企業

2天考取Google Ads證照!新手廣告投放攻略

擺脫設備工程師血汗職涯, 零基礎的我成功轉職 Python 資料工程師

44歲媽咪順利轉職網頁設計師, 家庭事業都得意

零基礎如何花 14 小時考取 GoogleAds 認證?五種 GoogleAds 廣告不藏私攻略

從無到有 挑戰14小時取得Google證照



這個網誌中的熱門文章

Python控制結構一點就通!(5)while迴圈

前端工程師絕不能搞錯的CSS中:逗號.空格的差別!

網頁前端CSS必學兩屬性:display與visible