Une brève discussion sur les constructeurs JavaScript

Quand il s'agit de "ConstructionFonction", la plupart des gens penseront au concept de classes Java JavaScript a également des constructeurs et sa syntaxe d'utilisation. est similaire à celle de Java ou La syntaxe de création d'objets est similaire dans d'autres langages basés sur les classes.

Le constructeur JavaScript est un type spécial de fonction, caractérisé par :

• Utilisez <a href="http://www.php.cn%20/wiki%20/165.html" target="_blank">nouveau<code><a href="http://www.php.cn/wiki/165.html" target="_blank">new</a>Fonction d'appel de mot clé

• La première lettre de la fonction est en majuscule

Lors des entretiens, je pose souvent deux questions sur les constructeurs :

1. Est-ce que la première lettre du constructeur doit être en majuscule ?

2. Y aura-t-il une erreur si j'exécute le constructeur directement sans utiliser le mot-clé new ? Si aucune erreur ne se produit, quelle est la différence entre appeler le constructeur avec new et sans new ?

En gros, 100 % des étudiants peuvent répondre correctement à la question 1 (majuscules et minuscules), et 20 % des étudiants répondront incorrectement à la question 2, en particulier à la deuxième question.

Alors, voyons ce que fait l'new opérateur  ?

1. Utilisez l'opérateur new pour appeler la fonction

Exemple :

function Person(name){
  this.name = name;
  this.say = function(){
    return "I am " + this.name;
  }
}

var person1 = new Person('nicole');
person1.say(); // "I am nicole"

Utilisez new pour appeler le constructeur, les modifications suivantes se produiront à l'intérieur de la fonction. :

• crée une variable this, qui pointe vers un objet vide. Et l'objet hérite du prototype de la fonction

• les propriétés et méthodes sont ajoutées à l'objet référencé par this;

• Renvoyer implicitement cet objet (si aucun autre objet n'est renvoyé explicitement)

Utiliser un pseudo-programme pour démontrer les changements ci-dessus :

function Person(name){
  // 创建this变量，指向空对象
  var this = {}; 
  // 属性和方法被加入到this引用的对象中
  this.name = name;
  this.say = function(){
    return "I am " + this.name;
  }
  // 返回this对象
  return this;
}

On peut voir que la plus grande caractéristique de l'utilisation de

pour appeler le constructeur est que l'objet new pointe vers l'objet this généré par le constructeur, donc renverra la person1.say() chaîne  : "Je suis Nicole".

小贴士

如果指定了返回对象，那么，"this"对象可能被丢失。

function Person(name){
  this.name = name;
  this.say = function(){
    return "I am " + this.name;
  }
  var that = {};
  that.name = "It is that!";
  return that;
}

var person1 = new Person('nicole');
person1.name; // "It is that!"

2. Appelez la fonction directement

Si la fonction est appelée directement, alors l'objet

pointe vers this, et aucun objet ne sera renvoyé par défaut (sauf si explicitement déclaré pour renvoyer une valeur). window

Prenons la fonction

comme exemple et appelons directement la fonction Person : Person

var person1 = Person('nicole');
person1; // undefined
window.name; // nicole

On voit que le résultat de l'appel direct du constructeur n'est pas ce que nous vouloir.

3. Résumé

Afin d'éviter d'appeler le constructeur parce que vous oubliez d'utiliser le mot-clé

, vous pouvez ajouter des conditions de jugement pour forcer l'appel au mot-clé new. Le code est le suivant : new

function Person(name){
  if (!(this instanceof Person)) {
    return new Person(name);
  }
  this.name = name;
  this.say = function(){
    return "I am " + this.name;
  }
}

var person1 = Person('nicole');
console.log(person1.say()); // I am nicole
var person2 = new Person('lisa');
console.log(person2.say()); // I am lisa

 

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!