早在我還在自學的時候就有學到了這個東西,但當時超不會使用的,

到了最近常常在 if 判斷中包另一個甚至多個 if 判斷,自己也覺得不容易解讀🤔,

就開始想著要寫的簡單明瞭一點,這時條件運算在處理簡單的 if 判斷時就會是不錯的選擇。


像我最近遇到一個狀況,是同樣的瀏覽器在不同平台上看到的畫面有些許的落差,

在WINDOWS上的Chrome瀏覽器畫面是正常的,但在MAC上的Chrome看到的畫面差了幾px。

(這個問題我還是不太清楚為什麼發生😅...)

所以目前只好先去取得使用者的作業系統,再另外改變 class 去適應。

程式碼一是我一開始的寫法,

程式碼一 :

settingForMac() {
	let os = navigator.platform
	let macSet = document.querySelector(".statusIcon")
  if (os === "MacIntel") {
		macSet.setAttribute("class","positionForMac")
  }
},

再來就是今天介紹的主角 :

條件運算則是先建立一個條件判斷式,後面再跟著一個問號 " ? ",如果條件是 truthy,

在冒號 " : " 前的表達式會被執行,如果條件是 falsy,則是冒號後的被執行。

這樣我就能將程式碼一改寫成程式碼二的樣子,

程式碼二 :

settingForMac() {
	let os = navigator.platform == "MacIntel" ? 1 : 0
  let macSet = document.querySelector(".statusIcon")
  os === 1 ? macSet.setAttribute("class", "setPosition") : ""
},

這樣看起來應該更簡潔一些吧,可以減少程式碼的行數也能減少一些括號更一目瞭然。

這算是我最近對條件運算式一些簡單的使用心得。