」工欲善其事,必先利其器。「—孔子《論語.錄靈公》
首頁 > 程式設計 > 了解 JavaScript 中的短路:初學者指南

了解 JavaScript 中的短路:初學者指南

發佈於2024-08-19
瀏覽:950

Understanding Short-Circuiting in JavaScript: A Beginner

當您第一次開始學習 JavaScript 時,您很快就會意識到編寫程式碼不僅僅是讓它運行。對於初學者來說,一個經常被忽視的強大概念是「短路」。它是 JavaScript 中邏輯運算的一個重要特性,可以讓您的程式碼更有效率和可讀。那麼,短路到底是什麼,它是如何運作的呢?

什麼是短路?

短路發生在邏輯運算中,如果第一個運算元已經確定了運算的結果,則不會計算第二個運算元。簡單來說,如果邏輯運算的結果可以由第一個值決定,JavaScript 甚至不會費心檢查第二個值。

JavaScript 有兩個支援短路的邏輯運算子:&& (AND) 和 || (或)。

與 && (AND) 運算子短路

&& 運算子檢查表達式兩邊是否都為 true。但是,如果第一個操作數為 false,則無需檢查第二個操作數,因為無論如何結果都會為 false。

例子:

const isLoggedIn = false;
const hasAccess = isLoggedIn && someFunction();

console.log(hasAccess); // false

在上面的範例中,someFunction() 永遠不會被調用,因為 isLoggedIn 為 false。 JavaScript 無需計算第二部分就知道整個表達式為假。

與 || 短路(或)運算符

||運算子檢查是否至少有一側為真。如果第一個操作數為 true,則整個表達式為 true,因此不計算第二個操作數。

例子:

const userRole = 'admin';
const role = userRole || 'guest';

console.log(role); // 'admin'

這裡,userRole 已經是 true('admin'),所以 JavaScript 甚至不考慮'guest'。角色的值為「admin」。

為什麼短路有用?

短路不只是一個巧妙的技巧;它也是一種技巧。它是編寫更簡潔、更有效率的程式碼的實用工具。以下是您可以使用它的幾種方法:

1。預設值:

const name = inputName || 'Guest';

如果 inputName 為空或 null,名稱將預設為「Guest」。

2.保護函式呼叫:

user && user.sendMessage('Hello!');

這確保僅當使用者存在時才呼叫 sendMessage。

3.惰性求值:

const result = complexCondition && performExpensiveOperation();

const result = complexCondition && performExpensiveOperation();

如果complexCondition為假,則跳過昂貴的操作,節省資源。

總結

短路可能看起來只是一個小細節,但理解它可以帶來更有效率、更易讀的程式碼。這是您在 JavaScript 中經常遇到的概念,因此儘早熟悉它將使您成為更強大的開發人員。嘗試在您自己的專案中嘗試它 - 您可能會發現它比您想像的更方便!

請記住,短路的神奇之處在於它的簡單性。它讓 JavaScript 完成足夠的工作來完成工作,不多也不少。作為一名開發人員,學習利用這種簡單性將對您大有裨益。快樂編碼!

版本聲明 本文轉載於:https://dev.to/victorusese/understanding-short-circuiting-in-javascript-a-beginners-guide-2mk4?1如有侵犯,請聯絡[email protected]刪除
最新教學 更多>
  • 解鎖 JavaScript 的隱藏寶石:未充分利用的功能可提高程式碼品質和效能
    解鎖 JavaScript 的隱藏寶石:未充分利用的功能可提高程式碼品質和效能
    In the ever-evolving landscape of web development, JavaScript remains a cornerstone technology powering countless large-scale web applications. While...
    程式設計 發佈於2024-11-07
  • 為什麼透過非常量指標修改「const」變數看起來有效,但實際上並沒有改變它的值?
    為什麼透過非常量指標修改「const」變數看起來有效,但實際上並沒有改變它的值?
    透過非常量指標修改 const在 C 中,const 變數一旦初始化就無法修改。但是,在某些情況下,const 變數可能會被更改。考慮以下代碼:const int e = 2; int* w = (int*)&e; // (1) *w = 5; ...
    程式設計 發佈於2024-11-07
  • Android - 將 .aab 檔案上傳到 Play 商店時出錯
    Android - 將 .aab 檔案上傳到 Play 商店時出錯
    如果您遇到此錯誤,請按照以下步驟操作以確保與您的套件名稱和簽署金鑰保持一致: 確保 app.json 檔案中的套件名稱與您第一次上傳 .aab 檔案時所使用的套件名稱相符。 "android": { "permissions":["CAMERA","READ_EXTERNAL_STO...
    程式設計 發佈於2024-11-07
  • 如何使用 PHP 將 HTML 轉換為 PDF
    如何使用 PHP 將 HTML 轉換為 PDF
    (適用於 Windows 的指南。不適用於 Mac 或 Linux) (圖片來源) 在 PHP 中將 HTML 轉換為 PDF 的方法不只一種。您可以使用Dompdf或Mpdf;但是,這兩個庫的執行方式有所不同。 注意:本文中並未包含所有解決方案。 要使用這兩個函式庫,您將需要 Composer...
    程式設計 發佈於2024-11-07
  • C++ 會擁抱垃圾收集嗎?
    C++ 會擁抱垃圾收集嗎?
    C 中的垃圾收集:實現和共識的問題C 中的垃圾收集:實現和共識的問題雖然有人建議C 最終會包含垃圾收集器,但它仍然是爭論和持續發展的主題。要理解其中的原因,我們必須深入研究迄今為止阻礙其納入的挑戰和考慮因素。 實現複雜性在 C 中加入隱式垃圾收集是一個非-瑣碎的任務。該語言的低級性質和對指針的廣泛支...
    程式設計 發佈於2024-11-07
  • 如何有條件地刪除 MySQL 中的欄位?
    如何有條件地刪除 MySQL 中的欄位?
    使用 MySQL ALTER 進行條件列刪除使用 MySQL ALTER 進行條件列刪除MySQL 中的 ALTER 指令提供了一種從表中刪除列的簡單方法。但是,當指定列不存在時,其傳統語法 (ALTER TABLE table_name DROP COLUMN column_name) 會引發錯誤...
    程式設計 發佈於2024-11-07
  • 你應該了解的現代 CSS 樣式 4
    你應該了解的現代 CSS 樣式 4
    TL;DR: 本博客使用代码示例来探索 Web 开发的五种最佳 CSS 样式和功能:容器查询、子网格、伪类、逻辑属性和实验室颜色空间。它们增强响应能力、简化布局并提高设计一致性。 层叠样式表 (CSS) 是一种众所周知的用于设计网页样式的语言。使用 CSS,您可以通过添加空格来自定义 HTML 元素...
    程式設計 發佈於2024-11-07
  • 箭頭函數或父作用域何時定義函數的參數?
    箭頭函數或父作用域何時定義函數的參數?
    ES6 箭頭函數中的參數:官方說明在 ES6 箭頭函數中,arguments 關鍵字的行為一直是爭論的話題。一些瀏覽器和平台(例如 Chrome、Firefox 和 Node)偏離了最初的 TC39 建議,引發了對該規範正確解釋的質疑。 根據官方 ES6 規範,箭頭函數沒有其自身的定義。自己的參數在...
    程式設計 發佈於2024-11-07
  • 根據您提供的內容,以下是一些採用問題格式的潛在文章標題:

* 載入資料本地內文件存取被拒絕:如何排除和修復錯誤? 
* 為什麼要載入資料LOCA
    根據您提供的內容,以下是一些採用問題格式的潛在文章標題: * 載入資料本地內文件存取被拒絕:如何排除和修復錯誤? * 為什麼要載入資料LOCA
    LOAD DATA LOCAL INFILE 存取被錯誤拒絕:不允許使用的命令當利用MySQL 的LOAD DATA INFILE 執行PHP 腳本時,它可能會遇到錯誤“用戶訪問被拒絕...(使用密碼:是)”。常見的解決方法是切換到 LOAD DATA LOCAL INFILE,儘管這可能會導致同一...
    程式設計 發佈於2024-11-07
  • 如何在 Python 中檢查文字檔是否為空?
    如何在 Python 中檢查文字檔是否為空?
    確定文字檔案是否為空在程式設計領域,通常需要確定特定檔案是否包含任何資料或無效。本文深入探討了這樣一個問題:「我們如何確定文字檔案是否為空?」Python 作為一種多功能程式語言,為這個問題提供了一個簡單的解決方案。透過利用 os.stat() 函數,我們可以檢索有關檔案的屬性數組,包括其大小。 查...
    程式設計 發佈於2024-11-07
  • 在 MySQL 中儲存 IPv6 位址的最佳方式是什麼?
    在 MySQL 中儲存 IPv6 位址的最佳方式是什麼?
    在MySQL 中儲存IPv6 位址:DECIMAL(39,0) 與VARBINARY(16)當面臨儲存IPv6 的挑戰時對於MySQL 中的位址,開發人員通常會考慮兩個選項:DECIMAL(39,0) 和2*BIGINT。雖然兩者各有優點,但出現了較以前的方法更具優勢的新解決方案。 DECIMAL(...
    程式設計 發佈於2024-11-07
  • ES6 類別是 JavaScript 原型模式的語法糖嗎?
    ES6 類別是 JavaScript 原型模式的語法糖嗎?
    ES6 類別只是 Javascript 中原型模式的語法糖嗎? 不,ES6 類別不僅僅是 Javascript 原型模式的語法糖原型模式。 雖然它們確實有一些相似之處,但也存在一些關鍵差異,這些差異使 ES6 類別成為創建和使用物件的更強大、更方便的方式。 以下是關鍵差異的細分ES6 類別與原型模...
    程式設計 發佈於2024-11-07
  • #daysofMiva 挑戰賽的第一天。
    #daysofMiva 挑戰賽的第一天。
    100 天挑戰的第一天 日期: 8/21/2024 目標: 學習並理解 JavaScript 中的變數、邏輯運算和資料類型,使用 JavaScript 解決數學問題,並開始學習事件監聽器和條件語句。 1. JavaScript變數介紹 今天,我透過學習變數開始了 JavaScrip...
    程式設計 發佈於2024-11-07
  • 如何將 PHP 產生的值安全地整合到 JavaScript 程式碼中?
    如何將 PHP 產生的值安全地整合到 JavaScript 程式碼中?
    將PHP 產生的值合併到頁面上的JavaScript 中嘗試將PHP 產生的值嵌入到JavaScript 程式碼中時,您可能會遇到類似於給定範例中的錯誤。要解決此問題,請考慮以下方法:<?php $htmlString = 'testing'; ?> <html> &l...
    程式設計 發佈於2024-11-07
  • 了解非同步 JavaScript
    了解非同步 JavaScript
    JavaScript 是一種單執行緒語言,這意味著它一次只能做一件事。然而,Web 應用程式通常需要執行從伺服器取得資料等任務,這可能需要一些時間。如果 JavaScript 必須等待每個任務完成才能繼續,那麼您的 Web 應用程式將會變得緩慢且無回應。這就是非同步(async)JavaScript...
    程式設計 發佈於2024-11-07

免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。

Copyright© 2022 湘ICP备2022001581号-3