在 JavaScript 中建立真正的私有方法有什麼缺點？

使用私有方法有一個簡單的底層概念。在這種情況下，您可以宣告私有方法或私有屬性，這些方法或屬性用於隱藏類的內部功能，使其不被其他類訪問，無論您何時希望保持某些內容私有，無論是方法還是屬性。您可以包含私有欄位、靜態方法、例項方法以及僅供您訪問的 getter 和 setter。

真正的私有欄位和方法是透過私有類特性提供的，由語言維護該隱私，而不是自定義。好處包括防止類特性與程式碼庫其他部分之間的命名衝突，並使類能夠擁有非常有限的介面。

私有方法與私有欄位一樣，以 # 開頭，並且無法被類外部的使用者訪問。當類需要執行復雜的內部函式但您不希望任何其他程式碼能夠呼叫它時，它們會派上用場。

其他程式語言，例如 C++、Java 等，將私有定義為任何不能透過物件直接訪問且不能與其他類共享的內容。同樣的概念也適用於 JavaScript。

因此，我們必須首先檢查 JavaScript 如何建立私有方法。我們可以使用四個主要的關鍵字在類中建立私有方法。

  • var
  • let
  • const
  • # （雜湊）

示例 1

在這個例子中，讓我們瞭解 JavaScript 中私有方法的基本示例。

<!DOCTYPE html>
<html>
<title>What is the drawback of creating true private methods in JavaScript - TutorialsPoint</title>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body style="text-align:center">
   <script>

      // written the class as tutpoint
      let tutpoint = function (company, launched) {

         // public member
         this.motorCar = "Maruti Suzuki Alto";

         // written code for private member
         let topic = "privateMethod";
         let status = launched;

         // written code for private member function
         let publish = () => {
            document.write(company +'<br>');
            return status;
         }

         // written code to call private member
         // written function inside the same class
         document.write(publish() +'<br>');
      };

      // tutpoint1 is object of tutpoint class
      let tutpoint1 = new tutpoint('Maruti Suzuki Baleno', 'Maruti Suzuki Brezza');

      // written to call public member outside the class
      document.write(tutpoint1.motorCar);
   </script>
</body>
</html>

在 JavaScript 中編寫真正的私有方法時，有兩個重要的缺點。

  • 不允許從類外部呼叫私有方法。

  • 當生成同一類的多個物件例項時，會存在記憶體效率低下問題，因為每個示例都需要方法的新副本。

示例 2

在這個例子中，讓我們瞭解如果在類外部呼叫私有成員函式會返回錯誤。

<!DOCTYPE html>
<html>
<title>What is the drawback of creating true private methods in JavaScript - TutorialsPoint</title>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body style="text-align:center">
   <script>
      let tutpoint = function (company, launched) {
         this.motorCar = "Maruti Suzuki Alto";
         let topic = "privateMethod";
         let status = launched;
         let publish = () => {
            document.write(company);
            return status;
         }
         document.write(topic +'<br>');
      };
      let tutpoint1 = new tutpoint('Maruti Suzuki Baleno', 'Maruti Suzuki Brezza');
      document.write(tutpoint1.motorCar );
      document.write(publish());
   </script>
</body>
</html>

請按鍵盤上的 f12 鍵訪問瀏覽器控制檯以檢視結果。

ReferenceError: publish is not defined

示例 3

在這個例子中，讓我們瞭解，如果在類外部呼叫私有成員函式。因此，以下示例的輸出是正確的

<!DOCTYPE html>
<html>
<title>What is the drawback of creating true private methods in JavaScript - TutorialsPoint</title>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body style="text-align:center">
   <script>
      class tutpoint {
         
         // Private field
         #motorCar;
         constructor(motorCar) {
            this.#motorCar = "Maruti Suzuki Alto";
         }
         
         #privateFunction(prefix) {
            return prefix + this.#motorCar;
         }
         publicFunction() {
            return this.#privateFunction(">>");
         }
      }
      let tutpoint1 = new tutpoint();
      document.write(tutpoint1.publicFunction());
   </script>
</body>
</html>

示例 4

在這個例子中，讓我們瞭解，如果我們構造同一類的多個物件，因為每個物件都會為自己或其自己的例項複製函式，在這種情況下。那麼在這種情況下就會出現記憶體效率問題。

<!DOCTYPE html>
<html>
<title>What is the drawback of creating true private methods in JavaScript - TutorialsPoint</title>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body style="text-align:center">
   <script>
      let motorCar = function (name, comp, cost) {
         this.name = name;
         this.company = comp;
         this.price = cost;

         // Private method
         let PriceIncrease = () => {
            this.price = this.price + 30000 +'<br>';
         };

         // Public method
         this.showPrice = () => {
            PriceIncrease();
            document.write(this.price);
         };
      };
      const one = new motorCar("one", "Alto", 480000);
      const two = new motorCar("two", "Baleno", 1100000);
      const three = new motorCar("three", "Brezza", 1600000);
      one.showPrice()
      two.showPrice()
      three.showPrice()
   </script>
</body>
</html>

更新於： 2022年8月24日

319 次檢視

開啟你的 職業生涯

透過完成課程獲得認證

開始學習
廣告