javascript - Quelqu'un peut-il m'aider à comprendre comment fonctionne ce programme?

Question

        var name = "this is window"
        var a = {
            name:"this is a",
            callname:function(){
                alert(this.name)
            }
        }
        function B(){
            alert(this.name)//this is B
        }
        B.prototype.name = "this is B";
        B.prototype.callname = function(){
            alert(this.name)
        }
        B.callname = function(){
            alert(this.name)
        }
        //a.callname()
        //B.callname()
        //(new B()).callname()

Quelles sont les valeurs obtenues par les trois derniers ? ? ?

Answer 1

Il y a trois raisons à votre confusion :
Premièrement, l'attribut name que vous avez défini, la fonction elle-même a un tel attribut, également appelé nom, qui brouille votre compréhension de ce problème.
Deuxièmement, le prototype n'est pas bien compris : pour les propriétés définies dans le prototype de la fonction, seul l'objet après instanciation (c'est-à-dire la nouvelle opération) peut obtenir sa valeur grâce à la méthode "variable.property".
Troisièmement, cela n'est pas bien compris : cela fait référence à l'objet qui appelle la méthode

Avant de répondre à votre question, regardons un exemple

var function X() {};
console.log(X.name);  
// 输出 "X", 
// 任何函数都有一个叫做name的属性，其值为该函数名。

Décomposons votre problème un par un (veuillez utiliser les outils de développement du navigateur Chrome pour vérifier)

1. Que produit B.callname() ?

   function B(){
     alert(this.name);
   }
   B.prototype.name = "this is B";
   B.callname = function(){
     alert(this.name)
   };

   B est une fonction, son nom = "B", la méthode B.callname est appelée et l'appelant est B, alors ceci dans la méthode callname fait référence à B. Vous souvenez-vous de ce qu'est B.name ? Il suffit de regarder le premier exemple ci-dessus pour comprendre.

   答案是  弹窗显示 “B”。

   Vous vous demanderez pourquoi « ceci est B » n'est-il pas défini par B.prototype.name ? Parce que les propriétés définies dans le prototype de B ne sont directement accessibles que par les instances de B.
   Si vous n'y croyez toujours pas, veuillez changer tous les noms, tels que xname, et la réponse à cette question deviendra indéfinie

2. a.callname() Que produit-il ?

   var a = {
     name:"this is a",
     callname:function(){    
         alert(this.name);
     }
   };

   a lui-même est une instance d'objet, définie en JSON. Le code ci-dessus est équivalent à

   a.name = "this is a";
   a.callname = function() {
         alert(this.name);
   }

   L'appelant de callname est un, alors celui-ci dans callname est un

   答案显而易见 弹窗显示  “this is a”
   

3. (new B()).callname() Que produit-il ?

   function B(){
     alert(this.name);
   }
   B.prototype.name = "this is B";
   B.callname = function(){
     alert(this.name)
   };

   Tout d'abord, new B() est exécuté en premier, créant une instance anonyme Nommons-la temporairement b, c'est-à-dire b = new B(), dans la fonction B This. est appelé b à ce moment, puis l'alerte de méthode dans le corps de la fonction B est exécutée séquentiellement. Qu'est-ce que b.name ? b est une instance. Il n'a pas d'attribut name. Il recherchera le nom dans la définition du prototype de la classe parent et trouvera "c'est B".new B()先执行， 创建了一个匿名实例，我们暂且给他命名为b, 即 b = new B(), 函数B中的this此时被指代为 b, 然后才是依次执行B函数体内的方法alert， b.name是什么？b是个实例，它本身没有name属性， 就会去父类的prototype定义中找name，找到了 "this is B".
   然后， b.callname() Ensuite, b.callname() est exécuté et callname est défini. Cela fait référence à l'appelant de la méthode b. L'instance b elle-même n'a pas d'attribut name. Elle trouvera la valeur de l'attribut name du prototype dans la classe parent et la renverra.

   答案是它会触发两次弹窗： 第一次弹窗 “this is B”， 第二次弹窗也是“this is B”
   

Answer 2

Dans le premier, cela représente l'objet a, donc c'est un pop-up. Dans le second, B représente la fonction B, et dans le troisième, c'est B qui apparaît en premier, car lors de l'instanciation La fonction sera exécutée. Il y aura alors une erreur de syntaxe car il n’y a pas de point-virgule dans l’instruction précédente (nouveau B()). S'il n'y a pas d'erreur de syntaxe, une autre ceci est B apparaîtra car l'objet instance appelle l'attribut name sur l'objet prototype.