recherche

Maison  >  Article  >  interface Web  >  Comment créer des variables privées en JavaScript ?

Comment créer des variables privées en JavaScript ?

WBOY
WBOYavant
2023-08-23 21:37:02927parcourir

如何在 JavaScript 中创建私有变量？

Les fermetures, les symboles, WeakMap, les champs privés de classe et les proxys sont quelques-unes des techniques qui peuvent être utilisées pour créer des variables privées en JavaScript. Chaque technologie présente des avantages et des inconvénients, il est donc crucial de choisir celle qui correspond le mieux à vos besoins.

Comme beaucoup d'autres langages de programmation, JavaScript possède également le concept de variables privées et de variables publiques. Les variables privées ne sont accessibles et modifiées que par du code appartenant à la même portée, mais les variables publiques sont accessibles et modifiées par n'importe quel code. Examinons les différentes techniques de création de variables privées en JavaScript.

Utilisez des fermetures

La méthode de fermeture est un moyen de créer des variables privées en JavaScript. Une fonction est une fermeture si elle peut accéder aux variables définies dans la portée de sa fonction parent même après que la fonction parent soit terminée et renvoyée. Nous pouvons définir une variable à l'intérieur d'une fonction afin qu'elle devienne privée et ne soit accessible que par le code à l'intérieur de cette fonction.

Exemple

<html>
<body>
   <div id="demo"></div>
   <script>
      function createPrivateVariable() {
         let privateVariable = "This is a private variable";
         return {
            getValue: function () {
               return privateVariable;
            },
            setValue: function (value) {
               privateVariable = value;
            },
         };
      }
      let privateVar = createPrivateVariable();
      document.getElementById("demo").innerHTML = privateVar.getValue();
   </script>
</body>
</html>

La fonction createPrivateVariable dans l'exemple ci-dessus renvoie un objet avec les méthodes getValue et setValue. Ces méthodes peuvent récupérer ou modifier la valeur de la privateVariable déclarée dans la fonction parent car elles y ont accès. Si vous essayez d'accéder à privateVariable depuis l'extérieur d'une fonction, une erreur de référence se produit.

Utilisez des types de données symboliques

L'utilisation de types de données symboliques est la deuxième façon de créer des variables privées. Les symboles peuvent être utilisés comme clés de propriété car ce sont des identifiants distincts sans chaîne. Parce qu’ils sont uniques, les programmes externes ne peuvent pas facilement y accéder ou les modifier. 

let privateVariable = Symbol();
let obj = {
   [privateVariable]: "This is a private variable"
};
console.log(obj[privateVariable]);

Exemple

Nous pouvons utiliser le code ci-dessus comme suit -

<html>
<body>
   <div id="demo"></div>
   <script>
      let privateVar = Symbol();
      let obj = {
         [privateVar]: "This is a private variable"
      };
      Object.defineProperty(obj, 'getValue', {
         get: function() {
            return obj[privateVar];
         }
      });
      document.getElementById("demo").innerHTML = obj.getValue;
   </script>
</body>
</html>

Dans cet exemple, un symbole nommé privateVariable a été défini et utilisé comme clé de propriété de l'objet. Puisqu'il s'agit d'un symbole, vous ne pouvez pas obtenir la valeur de la propriété en utilisant la notation par points, mais vous pouvez y accéder via l'objet en utilisant la notation entre crochets.

Utilisez WeakMap

WeakMaps peut être utilisé comme troisième façon de construire des variables privées. Le moteur JavaScript ne référence que faiblement les paires clé-valeur dans un WeakMap, ce qui vous permet de lier des objets avec des clés. Cela rend plus difficile la gestion incorrecte d'une référence à une variable privée, car le garbage collector détruira la paire clé-valeur s'il n'y a pas d'autres références à la clé.

Exemple

<html>
<body>
   <div id="demo"></div>
   <script>
      let privateVariables = new WeakMap();
      let obj = {};
      privateVariables.set(obj, "This is a private variable");
      document.getElementById("demo").innerHTML = privateVariables.get(obj);
   </script>
</body>
</html>

Dans cet exemple, nous créons un WeakMap nommé privateVariables pour contenir les variables privées de l'objet. La méthode get() permet d'obtenir une variable privée après l'avoir liée à un objet à l'aide de la méthode set(). Cependant, une variable privée n'est pas accessible depuis l'extérieur de la portée formée par l'objet car vous ne pouvez y accéder que lorsque vous disposez d'une référence à l'objet.

Utilisez la syntaxe de classe orientée objet

L'utilisation de la syntaxe de classe orientée objet peut également être utilisée pour créer des variables privées. Le mot-clé class de JavaScript nous permet de définir des classes qui servent de modèles pour les objets. Les classes peuvent définir des variables et ajouter le symbole # avant le nom de la variable pour générer des variables privées ; il s'agit d'une fonctionnalité expérimentale et représente des variables privées. Il n'est pas recommandé d'utiliser cette fonctionnalité dans le code de production car elle n'est pas encore largement prise en charge.

Exemple

<html>
<body>
   <p id="output"></p>
   <script>
      class MyClass {
         #privateVariable = "This is a private variable";
         getValue() {
            return this.#privateVariable;
         }
         setValue(value) {
            this.#privateVariable = value;
         }
      }
      let obj = new MyClass();
      document.getElementById("output").innerHTML = obj.getValue(); // "This is a private variable"
      obj.setValue("New value");
      document.getElementById("output").innerHTML = obj.getValue(); // "New value"
   </script>
</body>
</html>

Dans cet exemple, une classe nommée MyClass est construite à l'aide de variables privées #privateVariable, getValue et setValue. Une erreur de référence se produit si une méthode en dehors de la classe tente d'accéder à une variable privée accessible uniquement par les méthodes à l'intérieur de la classe.

Utiliser des objets proxy

Enfin, l'utilisation d'un objet Proxy est une autre option pour construire des variables privées. Les objets qui peuvent être utilisés pour intercepter ou modifier le comportement d'autres objets sont appelés proxys. Vous pouvez créer des variables privées accessibles uniquement par code avec un proxy en encapsulant l'objet dans un proxy.

Exemple

<html>
<body>
   <div id="demo"></div>
   <script>
      let privateVariable = "This is a private variable-proxy obj.";
      let handler = {
         get: function (target, name) {
            if (name === "privateVariable") {
               return privateVariable;
            }
         },
         set: function (target, name, value) {
            if (name === "privateVariable") {
               privateVariable = value;
            }
         },
      };
      let obj = new Proxy({}, handler);
      document.getElementById("demo").innerHTML = obj.privateVariable;
   </script>
</body>
</html>

Dans cet exemple, un proxy avec des gestionnaires avec des méthodes getter et setter a été construit. Ces méthodes peuvent récupérer ou modifier la valeur d'une variable privée définie en dehors du proxy et y accéder. Cependant, en raison d'une erreur de référence, la variable privée ne sera pas accessible depuis l'extérieur du proxy.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

JavaScript 数据类型 面向对象 封装 标识符 字符串 class 闭包 symbol 对象 作用域
Déclaration：
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer
Article précédent：Implémentez le tri par insertion à l'aide de JavaScript pour trier un tableau de nombres par ordre croissantArticle suivant：Implémentez le tri par insertion à l'aide de JavaScript pour trier un tableau de nombres par ordre croissant

Articles Liés

Voir plus