Explication détaillée des méthodes pratiques de création d'objets et d'héritage d'objets dans les connaissances JavaScript_Basic

Convention dans cet article : Sans déclaration particulière, les attributs font référence à des attributs ou à des méthodes.

La création d'objets et l'héritage d'objets sont en fait la même chose : les objets d'instance dont nous avons besoin obtiennent des propriétés privées via le constructeur et des propriétés partagées via la chaîne de prototypes. Qu'est-ce qu'une bonne manière ? Les propriétés privées sont obtenues via le constructeur (indépendamment des propriétés privées personnalisées dans l'instance) et n'ont pas besoin d'être réécrites. Les propriétés partagées sont trouvées via la chaîne de prototypes et n'ont pas besoin d'être créées à plusieurs reprises.

Approche universelle

Créez des objets en utilisant une combinaison de modèle de constructeur et de modèle de prototype

function HNU_student(name) {
  this.name = name;
  this.sayName = function() {
    return this.name;
  };
}
HNU_student.prototype = {
  school: 'HNU',
  saySchool: function() {
    return this.school;
  }
};
Object.defineProperty(HNU_student, 'constructor', {value: HNU_student});

var hiyohoo = new HNU_student('xujian');

Le prototype sera réécrit via des littéraux, et le constructeur du prototype pointe vers Object Si nécessaire, le constructeur doit être redéfini.

Héritage combinatoire parasitaire

function object(o) {
  function F() {};
  F.prototype = o;
  return new F();
}
function inheritPrototype(child, parent) {
  var prototype = object(parent.prototype);
  prototype.constructor = child;
  child.prototype = prototype;
}

function HNU_student(name) {
  this.name = name;
  this.sayName = function() {
    return this.name;
  };
}
HNU_student.prototype.school = 'HNU';
HNU_student.prototype.saySchool = function() {
  return this.school;
};

function Student_2011(name, number) {
  HNU_student.call(this, name);
  this.number = number;
  this.sayNumber = function() {
    return this.number;
  }
}
inheritPrototype(Student_2011, HNU_student);
Student_2011.prototype.graduationTime = 2015;
Student_2011.prototype.sayGraduationTime = function() {
  return this.graduationTime;
};

var hiyohoo = new Student_2011('xujian', 20110803203);

Le rôle de object() : Transformez l'objet passé en paramètre en prototype de l'instance, et les propriétés de l'objet sont partagées par toutes les instances.

Attributs partagés : hériterPrototype(Student_2011, HNU_student);, le prototype du sous-constructeur devient une instance du prototype du super-constructeur et les attributs du prototype du super-constructeur sont partagés avec le sous-constructeur.
Propriétés privées : HNU_student.call(this, name);, lors de la création d'une instance via le sous-constructeur, appelez le super-constructeur pour créer des propriétés privées.

Autres façons de créer des objets

Mode prototype dynamique

function HNU_student(name) {
  this.name = name;
  this.sayName = function() {
    return this.name;
  };

  if (!HNU_student.prototype.school) {
    HNU_student.prototype.school = 'HNU';
    HNU_student.prototype.saySchool = function() {
      return this.school;
    };
  }
}

var hiyohoo = new HNU_student('xujian');

Placez les propriétés partagées définies dans le prototype dans le constructeur, utilisez des instructions de jugement et initialisez les propriétés partagées du prototype lorsque le constructeur est appelé pour la première fois pour créer une instance.

Modèle de constructeur parasite

function SpecialArray() {
  var values = new Array();
  values.push.apply(values, arguments);
  values.toPipedString = function() {
    return this.join('|');
  };

  return values;
}

var colors = new SpecialArray('red', 'black', 'white');

est utilisé pour ajouter des attributs spéciaux au constructeur natif.

Autres modes d'héritage d'objets

Héritage combiné

function HNU_student(name) {
  this.name = name;
  this.sayName = function() {
    return this.name;
  };
}
HNU_student.prototype.school = 'HNU';
HNU_student.prototype.saySchool = function() {
  return this.school;
};
function Student_2011(name, number) {
  HNU_student.call(this, name);
  this.number = number;
  this.sayNumber = function() {
    return this.number;
  };
}
Student_2011.prototype = new HNU_student();
Student_2011.prototype.constructor = Student_2011;
Student_2011.prototype.graduationTime = 2015;
Student_2011.prototype.sayGraduationTime = function() {
  return this.graduationTime;
}
var hiyohoo = new Student_2011('xujian', 20110803203);

Attributs partagés : Student_2011.prototype = new HNU_student();, le prototype du sous-constructeur pointe vers le prototype du super-constructeur, et l'instance trouve tous les attributs partagés à travers la chaîne de prototypes.
Propriétés privées : HNU_student.call(this, name);, lors de la création d'une instance via le sous-constructeur, appelez le super-constructeur pour créer des propriétés privées.

Défaut : Le super constructeur est appelé deux fois. Student_2011.prototype = new HNU_student(); en même temps, les propriétés privées définies par le super constructeur sont créées dans le prototype du sous-constructeur. Les propriétés privées de ces prototypes sont écrasées et bloquées par les propriétés du même nom dans le prototype. exemple.

Héritage prototypique, héritage parasitaire

function object(o) {
  function F() {}
  F.prototype = o;
  return new F();
}
var student1 = {
  school: 'HNU',
  saySchool: function() {
    return this.school;
  }
};
var student2 = object(student1);

Object.creat() est une nouvelle méthode dans ECMAScript5. Elle accepte deux paramètres : l'un est l'objet d'origine comme prototype et l'autre est l'objet qui remplace ou ajoute des attributs. Sa fonction est la même que celle de l'objet personnalisé. ().

var student1 = {
  name: 'xujian',
  school: 'HNU'
};
var student2 = Object.create(student1, {
  name: {
    value: 'huangjing'
  }
});

L'héritage parasite ajoute des attributs supplémentaires pour améliorer les objets basés sur l'héritage prototypique.

function object(o) {
  function F() {}
  F.prototype = o;
  return new F();
}
function creatAnother(original) {
  var clone = object(original);
  clone.sayHi = function() {
    alert('Hi!');
  };
  return clone;
}
var student1 = {
  school: 'HNU',
  saySchool: function() {
    return this.school;
  }
};
var student2 = creatAnother(student1);

L'héritage prototypique et l'héritage parasite sont utilisés pour créer des objets d'instance similaires aux objets existants.