Une analyse approfondie et simple de son utilisation dans les compétences JavaScript_javascript

Les exemples de cet article décrivent l'utilisation de ceci en javaScript. Partagez-le avec tout le monde pour votre référence. L'analyse spécifique est la suivante :

Quand j'apprenais JavaScript auparavant, je n'arrivais pas à comprendre cela. Ce n'est pas aussi facile à comprendre qu'en Java. Je l'ai compris plus tard après avoir lu de nombreux articles écrits par d'autres. Maintenant, je passe en revue ce que d’autres ont écrit, de peur de l’oublier plus tard.

En général, il existe trois types de directions pour cela. Pointe vers la fenêtre globale, l’objet et le constructeur.

Conclusion : En Javascript, cela pointe vers l'objet actuel lorsque la fonction est exécutée. Pour faire simple, à quel objet appartient la méthode appelée, cela pointe vers cet objet.

1. Fenêtre globale

Code simple

var message = "this in window";
var printMessage = function(){
  console.info(this === window);
  console.info(this.message);
};
printMessage();

Étant donné que la méthode appelante printMessage appartient à window, le résultat de sortie est :

vrai ceci dans la fenêtre

Maintenant, si vous changez le code pour qu'il soit plus compliqué

var message = "this in window";
var printMessage = function(){
  console.info(this === window);
  console.info(this.message);
};
var obj = {
  message: 'this in obj',
  printMsg : function(){
 printMessage();
  }
};
obj.printMessage();

À l'heure actuelle, la méthode printMessage appartient à window, donc cela pointe toujours vers window. La méthode obj.printMessage appartient à l'objet obj. Voir l'analyse ci-dessous.

Le résultat de sortie est donc toujours : vrai ceci dans la fenêtre

2. L'objet

Maintenant, jetez un œil à l'objet et modifiez légèrement le code

var message = "this in window";
var printMessage = function(){
  console.info(this === window);
  console.info(this.message);
};
var obj = {
  message: 'this in obj',
  printMessage : window.printMessage
};
obj.printMessage();

Résultat :

faux ceci dans obj

Oui, vous avez raison. C'est toujours la conclusion de l'étape précédente. La méthode obj.printMessage appartient à l'objet obj, donc cela pointe vers obj.

D'accord, ne vous inquiétez plus, regardez le code :

var message = "this in window";
var printMessage = function(){
  console.info(this === window);
  console.info(this.message);
};
var obj = {
  message: 'this in obj',
  printMessage : function(){
 var obj2 = {
   message:'this in obj2',
   printMessage: window.printMessage
 };
 obj2.printMessage();
  }
};
obj.printMessage();

L'appel final est obj2.printMessage(), donc quand ceci est exécuté, c'est obj2

Résultat :

faux, ceci en obj2

Haha, c'est la même chose que tu penses ? Celui qui l'appelle désigne qui.

3. Constructeur

var Person = function(){
  this.age = 1;
  this.name = 'no name';
};
var p = new Person();
console.info('age = ' + p.age);
console.info('name = ' + p.name);

Résultat :

âge = 1 nom = pas de nom.

Alors, que fait le constructeur à cela ? Le "Comprendre la chaîne de prototypes javaScript en termes simples" mentionné précédemment comprend une analyse des nouveautés.

var Person = function(){};
var p = new Person();

Le nouveau processus est divisé en trois étapes suivantes :
(1) var p={}; c'est-à-dire initialiser un objet p
(2) p.__proto__ = Personne.prototype;
(3) Person.call(p); c'est-à-dire construire p, qui peut aussi être appelé initialisation p

Alors parlons d’appel.

méthode d'appel

S'applique à : Objet fonction
Appelez une méthode sur un objet pour remplacer l'objet actuel par un autre objet.

appel([thisObj[,arg1[, arg2[, [,.argN]]]]])

Paramètres :
cetObj
Facultatif. L'objet qui sera utilisé comme objet actuel.
arg1, arg2, , argN
Facultatif. Une séquence de paramètres de méthode sera transmise.

Description :
La méthode call peut être utilisée pour appeler une méthode au nom d’un autre objet. La méthode d'appel modifie le contexte d'objet d'une fonction du contexte initial au nouvel objet spécifié par thisObj. Si le paramètre thisObj n'est pas fourni, l'objet Global est utilisé comme thisObj.

Expliquez que la fonction de la méthode d'appel est en fait de modifier ce point de la méthode par défaut. La méthode d'appel doit être un objet de méthode. Lorsque call est appelé, le point this de l'objet de méthode deviendra le premier paramètre de la méthode d'appel.

var p = new Person();

Lorsque le constructeur Person est appelé, il peut être traité par appel, de sorte que ceci dans Person pointe vers p. This.age = 1 est équivalent à p.age = 1, de sorte que l'attribut age soit ajouté à p.

J'espère que cet article sera utile à la conception de la programmation JavaScript de chacun.