阿川私房教材:學程式,拿 offer!

63 個專案實戰,直接上手!
無需補習,按步驟打造你的面試作品。

立即解鎖你的轉職秘笈

由於Node.js在後端利用 JavaScript 的能力,它已迅速成為建立 Web 應用程式和系統軟體的標準。 Express等流行框架和Webpack等工具有助於其廣泛使用。儘管存在DenoBun等競爭對手,但 Node 仍然是領先的伺服器端 JavaScript 平台。

JavaScript 的多範式性質允許多種程式設計風格,但它也帶來了範圍和物件突變等風險。缺乏尾部呼叫最佳化使得大型遞歸迭代變得危險,而 Node 的單線程架構需要非同步程式碼來提高效率。儘管面臨挑戰,但遵循 JavaScript 中的關鍵概念和最佳實踐可以幫助 Node.js 開發人員編寫可擴展且高效的程式碼。

1. JavaScript 閉包

JavaScript 中的閉包是一個內部函數,即使在外部函數傳回控制權之後,它也可以存取其外部函數的作用域。閉包使內部函數的變數成為私有的。函數式程式設計迅速流行,讓閉包成為 Node 開發人員工具包的重要組成部分。下面是 JavaScript 中閉包的一個簡單範例:

圖片說明

  • 變數 count 被指派了一個外部函數。外部函數僅執行一次,它將計數器設為零並返回內部函數。 _counter變數只能由內部函數存取,這使得它的行為類似於私有變數。

  • 這裡的例子是一個高階函數(或元函數,一個接受或傳回另一個函數的函數)。閉包存在於許多其他應用程式中。每當您在另一個函數中定義一個函數並且內部函數獲得自己的作用域並存取父作用域時,閉包就會發生——也就是說,內部函數可以“看到”外部變數,但反之則不然。

  • 這對於像map(innerFunction)這樣的函數方法也很方便,其中innerFunction可以使用外部作用域中定義的變數。

2. JavaScript 原型

每個 JavaScript 函數都有一個原型屬性,用於附加屬性和方法。此屬性不可枚舉。它允許開發人員將方法或成員函數附加到其物件。 JavaScript 僅透過prototype 屬性支援繼承。對於繼承的物件,prototype 屬性指向該物件的父物件。將方法附加到函數的常見方法是使用原型,如下所示:

圖片說明

儘管現代 JavaScript 具有相當複雜的類別支持,但它仍然使用底層的原型系統。這是該語言大部分靈活性的來源。

3. 使用哈希名稱定義私有屬性

在過去,使用下劃線作為變數前綴的約定用於指示變數應該是私有的。然而,這只是一個建議,並不是平台強制的限制。現代 JavaScript 為類別提供主題標籤私有成員和方法

圖片說明

私有哈希名稱是 JavaScript 中一個較新且非常受歡迎的功能!最新的 Node 版本和瀏覽器都支援它,而 Chrome 開發工具允許您直接存取私有變數以方便使用。

4. 使用閉包定義私有屬性

有時您會看到另一種解決 JavaScript 原型系統中缺乏私有屬性的方法是使用閉包。現代 JavaScript 允許您使用主題標籤前綴定義私有屬性,如上面的範例所示。然而,這對於 JavaScript 原型系統不起作用。此外,這是您在程式碼中經常發現的一個技巧,了解它在做什麼很重要。

使用閉包定義私有屬性可以讓您模擬私有變數。需要存取私有屬性的成員函數應該在物件本身上定義。以下是使用閉包建立私有屬性的語法:

圖片說明

5.JavaScript模組

曾幾何時,JavaScript 沒有模組系統,開發人員設計了一個聰明的技巧(稱為模組模式)來組裝一些可以工作的東西。隨著 JavaScript 的發展,它產生了兩個而不是一個模組系統:CommonJS include語法和 ES6 require語法。

Node 傳統上使用 CommonJS,而瀏覽器則使用 ES6。然而,Node 的最新版本(最近幾年)也支援 ES6。現在的趨勢是使用 ES6 模組,有一天我們將只使用一種模組語法來跨 JavaScript 使用。 ES6 看起來像這樣(我們匯出預設模組然後匯入它):

圖片說明

您仍然會看到 CommonJS,有時需要使用它來導入模組。以下是使用 CommonJS 匯出然後匯入預設模組的樣子:

圖片說明

6. 錯誤處理

無論您使用哪種語言或環境,錯誤處理都是必不可少且不可避免的。節點也不例外。處理錯誤有三種基本方法:try/catch 區塊、拋出新錯誤和on()處理程序。

帶有 try/catch 的區塊是在出現問題時捕獲錯誤的可靠方法:

圖片說明

在這種情況下,我們使用console.error將錯誤記錄到控制台。您可以選擇拋出錯誤,將其傳遞給下一個處理程序。請注意,這會破壞程式碼流的執行;也就是說,目前執行停止,堆疊上的下一個錯誤處理程序接管:

圖片說明

現代 JavaScript 在其Error物件上提供了許多有用的屬性,包括用於查看堆疊追蹤的Error.stack 。在上面的範例中,我們使用建構子參數來設定Error.message屬性和Error.cause

您會發現錯誤的另一個地方是在非同步程式碼區塊中,您可以在其中使用.then()處理正常結果。在這種情況下,您可以使用on('error')處理程式或onerror事件,這取決於 Promise 如何傳回錯誤。有時,API 會傳回一個錯誤物件作為第二個回傳值和正常值。 (如果您在非同步呼叫上使用await,則可以將其包裝在try/catch 中來處理任何錯誤。)以下是處理非同步錯誤的簡單範例:

圖片說明

無論如何,永遠不要吞下錯誤!我不會在這裡展示,因為有人可能會複製並貼上它。基本上,如果您捕獲錯誤然後不執行任何操作,您的程式將默默地繼續執行,而沒有任何明顯的跡象表明出現了問題。邏輯將被打破,你將不得不思考,直到你發現你的 catch 區塊中什麼都沒有。 (請注意,提供沒有 catch 區塊的finally{}區塊將導致您的錯誤被吞噬。)

7. JavaScript 柯里化

柯里化是一種讓函數更加靈活的方法。使用柯里化函數,您可以傳遞函數期望的所有參數並獲取結果,也可以僅傳遞參數的子集並接收傳回的函數,該函數等待其餘參數。這是一個簡單的咖哩範例:

圖片說明

可以透過在一組單獨的括號中逐一傳遞每個參數來直接呼叫原始柯里化函數:

圖片說明

這是一項有趣的技術,它允許您建立函數工廠,其中外部函數允許您部分配置內部函數。例如,您也可以使用上面的柯里化函數,如下所示:

圖片說明

在實際使用中,當您需要建立許多根據某些參數而變化的函數時,這個想法可能會有所幫助。

8. JavaScript 應用、呼叫和綁定方法

儘管我們並不是每天都使用它們,但了解callapplybind方法是什麼還是很有好處的。在這裡,我們正在處理一些嚴重的語言彈性問題。從本質上講,這些方法允許您指定this關鍵字解析的內容。

在所有三個函數中,第一個參數總是要賦予函數的this值或上下文。

三者中,打電話是最簡單的。這與在指定其上下文時呼叫函數相同。這是一個例子:

圖片說明

請注意, applycall幾乎相同。唯一的區別是您將參數作為陣列傳遞,而不是單獨傳遞。陣列在 JavaScript 中更容易操作,為使用函數提供了更多可能性。這是使用applycall 的範例:

圖片說明

綁定方法允許您將參數傳遞給函數而不呼叫它。傳回一個新函數,其參數限制在任何其他參數之前。這是一個例子:

圖片說明

9. JavaScript 記憶

記憶化是一種最佳化技術,它透過儲存昂貴操作的結果並在同一組輸入再次出現時返回快取的結果來加速函數執行。 JavaScript 物件的行為類似於關聯陣列,因此可以輕鬆地在 JavaScript 中實現記憶化。以下是將遞歸階乘函數轉換為記憶階乘函數的方法:

圖片說明

10. JavaScript IIFE

立即呼叫函數表達式 (IIFE) 是建立後立即執行的函數。它與任何事件或非同步執行沒有任何關聯。您可以定義 IIFE,如下所示:

圖片說明

第一對括號function(){...}將括號內的程式碼轉換為表達式。 IIFE 也可以描述為自呼叫匿名函數。它最常見的用法是限制透過var建立的變數的範圍或封裝上下文以避免名稱衝突。

還有一些情況,您需要使用wait呼叫函數,但您不在非同步函數區塊內。這種情況有時會發生在您想要直接執行並作為模組匯入的檔案中。您可以將這樣的函數呼叫包裝在 IIFE 區塊中,如下所示:

圖片說明

11. 有用的論證功能

儘管 JavaScript 不支援方法重載(因為它可以處理函數上的任意參數計數),但它確實有幾個強大的工具來處理參數。其一,您可以定義具有預設值的函數或方法:

圖片說明

您也可以一次接受並處理所有參數,以便可以處理傳入的任意數量的參數。

圖片說明

如果您確實需要處理不同的參數配置,您可以隨時檢查它們:

圖片說明

另外,請記住 JavaScript 包含一個內建參數陣列。每個函數或方法都會自動為您提供參數變數,並保存傳遞給呼叫的所有參數。

結論

當您熟悉 Node 後,您會發現有很多方法可以解決幾乎所有問題。正確的方法並不總是顯而易見的。有時,針對特定情況有多種有效方法。了解許多可用的選項會有所幫助。

這裡討論的 10 個 JavaScript 概念是每個 Node 開發人員都將從中受益的基礎知識。但它們只是冰山一角。 JavaScript 是一種強大而複雜的語言。使用它的次數越多,您就會越了解 JavaScript 到底有多麼龐大,以及您可以用它做多少事情。


原文出處:https://dev.to/usman_awan/10-javascript-concepts-every-node-developer-must-master-2na

按讚的人:

共有 0 則留言


精選技術文章翻譯,幫助開發者持續吸收新知。

阿川私房教材:學程式,拿 offer!

63 個專案實戰,直接上手!
無需補習,按步驟打造你的面試作品。

立即解鎖你的轉職秘笈