Que sont les fonctions anonymes, les fonctions imbriquées et les fermetures ?

Fonction anonyme : Cela a également été mentionné dans l'article précédent, qui fait référence à une fonction sans nom de fonction

function (){ 
console.log('匿名函数') 
}

Qu'en est-il des fonctions imbriquées ? Veuillez regarder le code :

function test (){
   var  sum = 20;
   //内嵌函数
   demo = function(){
        alert(sum);
        console.log('我是嵌套函数');
    }
}

Comme indiqué dans le code, les fonctions sont intégrées à l'intérieur de fonctions, appelées fonctions imbriquées.

Qu'est-ce qu'une fermeture ?

Pas grand chose à dire, regardez le code

function demo(){
   var num = 0;
   
   // 返回一个函数 
   return function(){
      alert( num+1 );
   }
} 
//将返回的函数赋值给 add 变量
var add = demo();
// add就是一个闭包
add();

En le regardant de cette façon, on a l'impression que tant qu'il s'agit d'une fonction imbriquée et qu'elle peut accéder aux variables dans la portée supérieure, c'est une fermeture. est-ce ainsi?

Nous savons qu'en js, elle est divisée en portée globale et portée locale. Chaque fonction équivaut à une portée locale.

De même, les variables sont également divisées en variables globales et variables locales. Quelle est la différence ?

Dans le navigateur, l'objet de portée globale est window, ce qui signifie que l'objet window existe dès l'ouverture de la page.

En js, chaque fonction est une portée locale, et les variables locales seront créées lors de l'exécution de la fonction et détruites après l'exécution.

Les variables globales existeront toujours tant que la page n'est pas fermée. Il ne sera pas détruit lors de l'exécution de la fonction.

Alors, qu'est-ce que cela a à voir avec les fermetures ?

Dans le livre "JavaScript Advanced Programming", le concept de "scope chain" est évoqué. La particularité est que les variables globales peuvent être lues directement à l'intérieur de la fonction.

Cependant, les variables à l'intérieur de la fonction ne peuvent pas être lues depuis l'extérieur de la fonction.

En d'autres termes, la chaîne de visée est comme une échelle qui ne peut que monter mais pas descendre. Regardons l'extrait de code pour comprendre

var  name = "window";
var  age    =  20;
dmeo();
function demo(){
     var age = 21;
     console.log(name);  // window
     console.log(age);     //21
}

Lorsque la fonction demo() est exécutée, une chaîne menant à la portée globale est créée, qui enregistre les variables de la portée actuelle pour la recherche et le retour.

Lors de l'exécution du code console.log( name ), il recherchera si la variable name existe dans la portée actuelle (fonction de démonstration). Puisque la portée actuelle n'existe pas, le nom de la variable globale se trouve vers le haut. Par conséquent, window;

Lors de l'exécution du code console.log(age), il recherchera également si la variable age existe dans la portée actuelle (fonction de démonstration). Parce qu'elle existe, 21 est renvoyé.

Puisque le mécanisme ne peut lire que vers le haut, alors considérons une question, comment lire les variables de la fonction interne en externe ?

Il n'y a aucun moyen, il suffit d'apporter quelques modifications. Cela nécessite l'utilisation du concept de fermeture.

function  f1(){
   var num = 0 ;
   //定义内部函数
   function f2(){
      return  num + 1;
   }
   //返回 f2函数引用
   retufn  f2;
}

// bar 变量也指向 f2 函数，在此也是一个闭包
var bar = f1();

//执行
bar();   // 1;

Nous savons que les variables de la fonction seront détruites après l'exécution de la fonction. Comme pour le code ci-dessus, une fois la fonction f1() exécutée, la fonction f2 est affectée à une variable globale et la variable de la fonction f2 dépend de la variable num de f1. Par conséquent, la variable num dans f1

.

ne changera pas. Il est détruit une fois la fonction f1 exécutée.

Nous empruntons ici le titre de « Ruan Yifeng » pour analyser et approfondir notre compréhension.

Lien : Apprentissage des fermetures javaScript

var name = "the window";
  
 var obj = {
      name : 'the obj',
      getName : function(){
          return funciton(){ 
               return this.name;
          }
      }
}

//执行 getName返回的函数
alert(obj.getName()());

Regardons l'analyse de la fonction d'appel et divisons-la en deux parties pour l'exécution. Regardons d'abord obj.getName(); À ce stade, la fonction getName est appelée par l'objet obj, donc la valeur de ceci est obj. Mais cette fois, il ne produit pas mais renvoie une fonction.

Ajoutez un (); pour exécuter la fonction renvoyée, mais la fonction renvoyée n'est appelée par aucun objet. Lorsqu'elle n'est pas appelée par l'objet lui-même, la valeur de this sera promue en objet fenêtre. Le résultat est donc "la fenêtre"

var name = "the Window";
var obj = {
    name : "the obj",
    getName : funciton(){
        var that = this;
        return function(){
             return that.name;
         }
    }
}
//执行 getName 返回的函数
alert(obj.getName()());

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!