Fermetures JavaScript - portée du bloc et variables privées

Portée au niveau du bloc

La portée au niveau du bloc fait référence à la portée dans le bloc de code entourée d'accolades. Il n'y a pas de portée de bloc en JavaScript. Afin de comprendre ce concept, regardez l'exemple suivant :

for(var i = 0;i < 10; i++){
  ......
}
alert(i); //结果会输出10

Dans le code ci-dessus, nous définissons la variable i dans la boucle for Dans les langages de programmation​​tels que C et Java, une fois l'exécution de la boucle terminée, la variable for i dans la boucle sera immédiatement récupérée. Mais en JavaScript, les variables existeront toujours, qu'une boucle ou un jugement soit utilisé. Nous pouvons voir à partir des résultats d’impression que la valeur imprimée après la fin de la boucle for est 10.

Lorsqu'une variable est utilisée dans l'environnement global pour une boucle ou un jugement, cette variable peut affecter les variables de la fonction, donc n'utilisez pas de variables globales sauf dans des circonstances particulières, et les variables globales sont dans la chaîne de portée. la couche supérieure a l'accès le plus lent.

La solution pour bloquer la portée est d'utiliser des fonctions anonymes. Regardons le code ci-dessous.

(function(){
  for(var i = 0; i < 10; i++){
    ......
  }
})();
 
// 直接打印i值会报错：i没有定义
alert(i);
 
// i is not defined
function fn(){
  alert(i);
}
fn();

Dans le code ci-dessus, nous mettons le bloc de code dans une fonction anonyme puis appelons immédiatement la fonction anonyme. Notez la paire de parenthèses après la fonction anonyme, qui indique l'appel à la fonction anonyme. Vous pouvez voir ce style d’écriture dans de nombreux programmes JavaScript. À ce stade, les variables de la fonction anonyme seront recyclées après utilisation et ces variables ne seront pas accessibles en dehors de la fonction anonyme.

Lorsque nous faisons du développement en équipe, nous devrons peut-être définir des variables globales avec le même nom, nous devons donc développer les habitudes suivantes pendant le développement : mettre le code de la variable globale dans une fonction anonyme, et immédiatement L'appel de fonctions anonymes peut également exécuter le code de variables globales, mais ces variables sont contrôlées dans la portée que nous souhaitons contrôler.

Variables privées

Lorsque nous avons défini un objet précédemment, nous avons utilisé le mot-clé this pour définir les propriétés de l'objet. Les propriétés définies par cette méthode sont appelées propriétés publiques et nous pouvons accéder à ces propriétés directement via l'objet.

Dans les langages de programmation tels que C et Java, le mot-clé private est utilisé pour définir les propriétés privées d'un objet. Les propriétés privées ne sont pas directement accessibles par l'objet. Alors, comment définir des propriétés privées (variables privées) en JavaScript ? En fait, c’est très simple. Il suffit de fournir une paire de méthodes set et get pour l’objet. Par exemple, le code suivant :

function Person(name){
  //此时就没有方法直接访问name这个属性，因为没有this.name
  //要访问name只能通过this.getName和this.setName来访问
  this.setName = function(value){
    name = value;
  }
  this.getName = function(){
    return name;
  }
}
 
var p = new Person("Leon");
alert(p.getName());

Nous utilisons la méthode this.setName() pour définir l'attribut de nom de l'objet, et utilisons la méthode this.getName pour obtenir l'attribut de nom de l'objet. De cette façon, l'attribut name de l'objet n'est pas accessible directement car il n'y a pas d'attribut this.name.

Le problème avec l'utilisation de la méthode ci-dessus pour créer des variables privées est que chaque objet stocke un grand nombre de fonctions, ce qui consomme beaucoup de mémoire. La solution à ce problème consiste à utiliser des variables privées statiques. Le code est le suivant :

var name = "";
var Person= function(value){
  name = value;
}
Person.prototype.setName = function(value){
  name = value;
}
Person.prototype.getName = function(){
  return name;
}
 
var p1 = new Person("Leon");
alert(p1.getName());
p1.setName("Ada");
alert(p1.getName());

En plaçant les méthodes setName() et getName() dans la chaîne de prototypes de l'objet, le problème des copies multiples de la méthode peut être résolu. Cependant, le code ci-dessus présente certains risques de sécurité, qui sont les problèmes de portée au niveau des blocs que nous avons mentionnés plus tôt. De même, nous pouvons mettre ce code dans une fonction anonyme pour résoudre ce problème.

(function(){
  //name在函数结束之后就被回收，在外面是没有方法接收的
  var name = "";
  Person= function(value){
    name = value;
  }
  Person.prototype.setName = function(value){
    name = value;
  }
  Person.prototype.getName = function(){
    return name;
  }
})();
 
var p1 = new Person("Leon");
alert(p1.getName());
p1.setName("Ada");
alert(p1.getName());

Mettez la définition de la classe Person dans une fonction anonyme, puis exécutez la fonction anonyme immédiatement. Cela garantit non seulement que l'objet ne peut pas être utilisé pour accéder directement aux propriétés, mais garantit également que chaque objet partage la même copie de la méthode.

Ce qui précède est le contenu de la portée JavaScript au niveau du bloc de fermeture et des variables privées. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !