Série avancée JavaScript – Prototype

• Recherche de propriété

• Propriétés du prototype

• Performances

• Prototypes qui étendent les types intégrés

• Résumé

JavaScript n'inclut pas le modèle d'héritage de classe traditionnel, mais utilise le modèle prototype prototype.

est souvent mentionné comme une lacune de JavaScript. En fait, le modèle d'héritage basé sur un prototype est plus puissant que l'héritage de classe traditionnel. L'implémentation du modèle d'héritage de classe traditionnel est simple, mais l'implémentation de l'héritage prototypique en JavaScript est beaucoup plus difficile. (Il est par exemple assez trivial de construire un modèle classique dessus, alors que l'inverse est une tâche bien plus difficile.)

JavaScript est le seul langage largement utilisé basé sur l'héritage prototypique. Il faut du temps pour comprendre la différence entre les deux modèles d'héritage.

La différence réside dans la manière dont JavaScript utilise l'héritage de chaîne de prototypes.

function Foo() {
    this.value = 42;
}
Foo.prototype = {
    method: function() {}
};

function Bar() {}

// 设置Bar的prototype属性为Foo的实例对象
Bar.prototype = new Foo();
Bar.prototype.foo = 'Hello World';

// 修正Bar.prototype.constructor为Bar本身
Bar.prototype.constructor = Bar;

var test = new Bar() // 创建Bar的一个新实例

// 原型链
test [Bar的实例]
    Bar.prototype [Foo的实例] 
        { foo: 'Hello World' }
        Foo.prototype
            {method: ...};
            Object.prototype
                {toString: ... /* etc. */};

Dans l'exemple ci-dessus, l'objet test hérite de Bar.prototype et Foo.prototype donc, il peut accéder à la méthode prototype de Foo ; En même temps, il peut également accéder à la valeur de la propriété d'instance Foo définie sur le prototype. Notez que new Bar() ne crée pas une nouvelle instance Foo, mais réutilise l'instance sur son prototype, donc toutes les instances Bar partageront la même propriété value ;

Recherche de propriété

Lors de la recherche d'une propriété sur un objet, JavaScript parcourt la chaîne de prototypes jusqu'à ce qu'il trouve une propriété avec un nom donné.

atteint le sommet de la chaîne de prototypes - c'est-à-dire Object.prototype - mais la propriété spécifiée n'est toujours pas trouvée et undéfini est renvoyé.

Remarque : n'utilisez pas Bar.prototype = Foo car cela n'exécutera pas le prototype de Foo mais pointera vers la fonction Foo. Ainsi, la chaîne de prototypes reviendra à Function.prototype au lieu de Foo.prototype, donc la méthode ne sera pas sur la chaîne de prototypes de Bar.

Attribut prototype

Lorsque l'attribut est utilisé pour créer une chaîne prototype, tout type de valeur peut lui être attribué (prototype). Cependant, l'attribution de types atomiques au prototype sera ignorée.

function Foo() {}
Foo.prototype = 1; // 无效

L'attribution de l'objet au prototype, comme indiqué dans l'exemple ci-dessus, créera dynamiquement la chaîne de prototypes.

Performance

Si une propriété se situe à l'extrémité supérieure de la chaîne de prototypes, cela aura un impact négatif sur le temps de recherche. En particulier, tenter d’accéder à une propriété qui n’existe pas traversera toute la chaîne de prototypes.

Et, lorsque vous utilisez une boucle for in pour parcourir les propriétés d'un objet, toutes les propriétés de la chaîne de prototypes seront accessibles.

Extendre le prototype d'un type intégré

Une fonctionnalité incorrecte qui est souvent utilisée consiste à étendre Object.prototype ou d'autres objets prototypes du type intégré.

Cette technique s'appelle le patching de singe et brise l'encapsulation. Bien qu'il soit largement utilisé dans certaines bibliothèques JavaScript telles que Prototype, je ne pense toujours pas que ce soit une bonne idée d'ajouter des fonctions non standard aux types intégrés.

La seule raison d'étendre les types intégrés est d'être cohérent avec le nouveau JavaScript, tel que Array.forEach.

Résumé

Avant d'écrire des applications JavaScript complexes, comprendre parfaitement le fonctionnement de l'héritage de chaîne de prototypes est un must pour tout programmeur JavaScript. Méfiez-vous des problèmes de performances causés par les longues chaînes de prototypes et sachez comment améliorer les performances en raccourcissant la chaîne de prototypes. De plus, n'étendez jamais les prototypes de types intégrés, sauf pour des raisons de compatibilité avec les nouveaux moteurs JavaScript.

Remarque : Il s'agit d'une méthode couramment utilisée dans le domaine de la programmation, appelée Backport, qui consiste à ajouter de nouveaux correctifs à l'ancienne version.

Ce qui précède est le contenu de JavaScript Advanced Series - Prototype. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (m.sbmmt.com) !