iT邦幫忙

2024 iThome 鐵人賽

DAY 12
0
自我挑戰組

JS漫遊記系列 第 12

JS漫遊記-12-邏輯運算子

  • 分享至 

  • xImage
  •  

https://ithelp.ithome.com.tw/upload/images/20240824/20166952UAnxaR3kSV.jpg

嗨嗨~又到了美好的假日時光~
大家有睡好吃飽嗎~我還是一如往常很想要睡覺
那沒有邏輯的914要來講邏輯運算子了!XD

今天要來提邏輯運算子的部分,下篇文章會來提到對於短路特性的研究!
前情提要&注意事項
1.if...else目前還沒有提到詳細提到,但這裡會小說明一下唷
2.以下為程式碼說明:

if (條件) {
    // 如果條件為真,執行這裡的程式碼
} else {
    // 如果條件為假,執行這裡的程式碼
}

&& 所有條件皆符合
其實就是什麼條件都要符合辣~不能夠有任何一個條件少(偏麻煩的一個邏輯運算子XD)

&&的舉例-註冊表單驗證
假設有一個註冊表單,要求使用者必須填寫所有必填欄位才能提交喔


let username = "joyce";//宣告使用者名字
let email = "joyce914@gmail.com";//宣告信箱
let password = "joyce914";//宣告密碼

// 假設這些都是必填欄位,檢查是否都已填寫
if (username && email && password) { //()中的判斷式:username、email、password為這三個都有寫的話
  console.log("所有必填欄位已填寫,可以提交註冊表單。");//印出所有必填欄位已填寫,可以提交註冊表單。
} else { //如果都沒有填寫的話
  console.log("請填寫必填欄位");//印出請填寫必填欄位。
}
// 印出: 所有必填欄位已填寫,可以提交註冊表單

|| 符合一項條件
符合任何一項條件即可唷

||的舉例-認證方式檢查
使用者可以使用不同的認證方式登入,比如使用電子郵件或者社交媒體帳號進行登入。

let isEmailLogin = true; //使用者使用信箱登入
let isSocialLogin = false;//使用者使用社群媒體登入

// 檢查是否有使用任何一種登入方式
if (isEmailLogin || isSocialLogin) { //如果使用者用信箱或式社群媒體登入
    console.log("登入成功。");//印出登入成功
} else {//否則
    console.log("請選擇一種有效的登入方式。");//印出:請選擇一種有效的登入方式
}
// 印出: 登入成功。

** ! (Not) **

Not 會把改變原本的意思,將其變成相反值。有點尷尬!好饒口XD
所以呢~我們來看舉例哈哈

var n1 = !true; // !true 回傳 false
var n2 = !false; // !false 回傳 true
var n3 = !"Cat"; // !Cat 回傳 false

!的舉例-登錄方式
假設有一個應用程序,需要檢查用戶是否未登入。

let isLoggedIn = true;//使用者已經登入系統(宣告變數isLoggedIn被設為布林值 true,表示使用者已經登入系統)

// 檢查用戶是否未登入
if (!isLoggedIn) {  //因為使用 ! 所以是:用戶沒有登入的狀況
    console.log("用戶未登入");//印出:用戶未登入
}else {//否則
    console.log("用戶已登入");//印出:用戶已登入
}
// 印出: 用戶已登入

是超級新手,若有任何建議或是錯誤的部分,歡迎底下留言唷thanks
我們下篇文章見掰掰~

對自己多用點心,日益努力,而後風生水起。盡情玩耍,盡情學習,盡情熱愛,盡情討厭,在需要的時候釋放善意,在必要的時候展現強硬,把這不得不過完的一生,變成值得慶賀的一生。

參考資源
https://ithelp.ithome.com.tw/articles/10243261
https://ithelp.ithome.com.tw/articles/10242544
https://hsuchihting.github.io/javascript/20200413/2524097541/
https://miahsuwork.medium.com/%E7%AC%AC%E5%9B%9B%E9%80%B1-javascript-%E6%A0%B9%E6%93%9A%E4%B8%8D%E5%90%8C%E6%A2%9D%E4%BB%B6%E5%9F%B7%E8%A1%8C%E4%B8%8D%E5%90%8C%E6%93%8D%E4%BD%9C-if-593c8440d843


上一篇
JS漫遊記-11-比較運算子
下一篇
JS漫遊記-13-短路特性
系列文
JS漫遊記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言