JavaScript條件語句的效能問題
條件語句
和循環一樣,條件語句同樣會改變運行流
JavaScript的條件語句分為兩個
if-else
switch
#if-else是我們最常用的了
不過if- else語句與switch語句很多情況都能夠互相替換
比如說下面的程式碼等價
if(foo){ ...}else{ ...}
switch(foo){ case true: ... default: ...}
條件少的時候大家更傾向於使用if-else
但是條件多的化switch看起來更容易理解
if(foo === 1){ ...}else if(foo === 2){ ...}else if(foo === 3){ ...}else if(foo === 4){ ...}else{ ...}
switch(foo){ case 1: ... case 2: ... case 3: ... case 4: ... default: ...}
但是我們使用的這兩種條件語句哪種性能更好呢
如果條件數量非常大的話,switch語句運行的更快更明顯
準確的說:條件增加時,if-else效能負擔增加程度更大
(大多數語言switch語句採用branch table 分支表索引來優化)
而且在JavaScript中,switch語句是不會發生強制類型轉換的,
也就是使用全等運算子進行比較
這樣就不會有型別轉換的損耗
所以我們在條件數量少時使用if-else,條件數量多時使用switch
從效能角度考慮是合理的
(if-else適用於判斷兩個離散值或幾個不同值域,switch適用於判斷多個離散值)
##我們在使用if -else語句時,應該按照機率由大變小的順序排列
這很好理解,但卻很容易被我們忽略
另外一點優化就是盡量把if-else組織成一系列嵌套的if- else語句
這就類似我們數學上的二分法,可以減少範圍、減少執行時間
像這樣
if(foo >= 1 && foo < 3){ //...}else if(foo >= 3 && foo < 5){ //...}else if(foo >= 5 && foo < 7){ //...}else{ //...}
if(foo >= 1 && foo < 5){ if(foo < 3){ //... }else{ //... } }else{ if(foo < 7){ //... }else{ //... } }
function fn(a){ switch(a){ case 0: return 0; case 1: return 1; case 2: return 2; case 3: return 3; case 4: return 4; case 5: return 5; case 6: return 6; case 7: return 7; } }
function fn(a){ var retArr = [0,1,2,3,4,5,6,7]; return retArr[a]; }
在條件數量越來越多時,查找表也幾乎不會產生額外的性能開銷
不過它更適用於單一鍵與單一值之間存在邏輯對應的情況
? :
就相當於if-else
三目運算子更適用於關注回傳值的情境
什麼意思呢,看下面的程式碼
var foo;;if(flag){ foo = 1; }else{ foo = 2; }
var foo = flag ? 1 : 2;
flag ? 1 : 2的回傳值
直接賦值給foo變數
這種場合非常適合使用三目運算子
#以上就是JavaScript中條件語句的效能問題
雖然我們很少用到條件數量很大的情況
而且現代瀏覽器js引擎還特別強大(例如V8引擎[]~( ̄▽ ̄) ~*)
不過了解一下沒壞處…
#

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

如何使用WebSocket和JavaScript實現線上語音辨識系統引言:隨著科技的不斷發展,語音辨識技術已成為了人工智慧領域的重要組成部分。而基於WebSocket和JavaScript實現的線上語音辨識系統,具備了低延遲、即時性和跨平台的特點,成為了廣泛應用的解決方案。本文將介紹如何使用WebSocket和JavaScript來實現線上語音辨識系

WebSocket與JavaScript:實現即時監控系統的關鍵技術引言:隨著互聯網技術的快速發展,即時監控系統在各個領域中得到了廣泛的應用。而實現即時監控的關鍵技術之一就是WebSocket與JavaScript的結合使用。本文將介紹WebSocket與JavaScript在即時監控系統中的應用,並給出程式碼範例,詳細解釋其實作原理。一、WebSocket技

如何利用JavaScript和WebSocket實現即時線上點餐系統介紹:隨著網路的普及和技術的進步,越來越多的餐廳開始提供線上點餐服務。為了實現即時線上點餐系統,我們可以利用JavaScript和WebSocket技術。 WebSocket是一種基於TCP協定的全雙工通訊協議,可實現客戶端與伺服器的即時雙向通訊。在即時線上點餐系統中,當使用者選擇菜餚並下訂單

隨著Vue的使用越來越廣泛,Vue的開發者也需要考慮如何優化Vue應用程式的效能和記憶體佔用。本文將討論Vue開發的一些注意事項,幫助開發者避免常見的記憶體佔用和效能問題。避免無限循環當一個元件不斷更新自己的狀態,或一個元件不斷渲染它自己的子元件時,可能會導致無限循環。這種情況下,Vue將會耗盡記憶體並且使應用程式非常緩慢。為了避免這種情況,Vue提供了一

如何使用WebSocket和JavaScript實現線上預約系統在當今數位化的時代,越來越多的業務和服務都需要提供線上預約功能。而實現一個高效、即時的線上預約系統是至關重要的。本文將介紹如何使用WebSocket和JavaScript來實作一個線上預約系統,並提供具體的程式碼範例。一、什麼是WebSocketWebSocket是一種在單一TCP連線上進行全雙工

JavaScript和WebSocket:打造高效的即時天氣預報系統引言:如今,天氣預報的準確性對於日常生活以及決策制定具有重要意義。隨著技術的發展,我們可以透過即時獲取天氣數據來提供更準確可靠的天氣預報。在本文中,我們將學習如何使用JavaScript和WebSocket技術,來建立一個高效的即時天氣預報系統。本文將透過具體的程式碼範例來展示實現的過程。 We

JavaScript教學:如何取得HTTP狀態碼,需要具體程式碼範例前言:在Web開發中,經常會涉及到與伺服器進行資料互動的場景。在與伺服器進行通訊時,我們經常需要取得傳回的HTTP狀態碼來判斷操作是否成功,並根據不同的狀態碼來進行對應的處理。本篇文章將教你如何使用JavaScript來取得HTTP狀態碼,並提供一些實用的程式碼範例。使用XMLHttpRequest

用法:在JavaScript中,insertBefore()方法用於在DOM樹中插入一個新的節點。這個方法需要兩個參數:要插入的新節點和參考節點(即新節點將要插入的位置的節點)。
