Maison interface Web js tutoriel Méthode minimaliste pour compléter l'encapsulation et l'héritage JavaScript

Méthode minimaliste pour compléter l'encapsulation et l'héritage JavaScript

Nov 30, 2017 am 09:25 AM
javascript js 继承

Dans cet article, nous allons parler d'une connaissance relativement nouvelle pour les débutants : l'écriture de cours JavaScript en utilisant la méthode minimaliste. L'« approche minimaliste » est l'œuvre du programmeur néerlandais Gabor de Proposée par Mooij, cette méthode n'utilise pas de prototype, et le code est très simple à déployer. C'est probablement pour cela qu'on l'appelle la « méthode minimaliste ». Ce qui suit présentera comment utiliser la méthode minimaliste pour compléter l'encapsulation et l'héritage JavaScript. J'espère que cela sera utile à tout le monde.

1. Encapsulation

Premièrement, il utilise également un objet pour simuler une "classe". Dans cette classe, définissez un constructeur createNew() pour générer des instances.

var Cat = {
    createNew: function(){
      // some code here
    }
};
Copier après la connexion


Ensuite, dans createNew(), définissez un objet instance et utilisez cet objet instance comme valeur de retour.

var Cat = {
     createNew: function(){
       var cat = {};
       cat.name = "大毛";
       cat.makeSound = function(){ alert("喵喵喵"); };
       return cat;
     }
 };
Copier après la connexion

Lorsque vous utilisez

, appelez la méthode createNew() pour obtenir l'objet instance.

var cat1 = Cat.createNew();
cat1.makeSound(); // 喵喵喵
Copier après la connexion


L'avantage de cette méthode est qu'elle est facile à comprendre, a une structure claire et élégante et est conforme à la construction traditionnelle de « programmation orientée objet » , de sorte que les caractéristiques suivantes peuvent être facilement déployées.

2. Héritage

Laissez une classe hériter d'une autre classe, ce qui est très pratique à implémenter. Appelez simplement la méthode createNew() de ce dernier dans la méthode createNew() du premier.
Définissez d’abord une classe Animal :

var Animal = {
    createNew: function(){
      var animal = {};
      animal.sleep = function(){ alert("睡懒觉"); };
      return animal;
    }
};
Copier après la connexion


Ensuite, dans la méthode createNew() de Cat, appelez la méthode createNew() d’Animal

var Cat = {
     createNew: function(){
       var cat = Animal.createNew();
       cat.name = "大毛";
       cat.makeSound = function(){ alert("喵喵喵"); };
       return cat;
     }
 };
Copier après la connexion


L'instance Cat obtenue de cette manière héritera de la classe Animal.

var cat1 = Cat.createNew();
cat1.sleep(); // 睡懒觉
Copier après la connexion


3. Propriétés privées et méthodes privées

Dans la méthode createNew(), tant que ce n'est pas le cas. défini dans l'objet cat. Les méthodes et propriétés sont toutes privées.

var Cat = {
    createNew: function(){
      var cat = {};
      var sound = "喵喵喵";//私有属性
      cat.makeSound = function(){ 
     alert(sound); 
    };
      return cat;
    }
};
Copier après la connexion


La variable interne sound dans l'exemple ci-dessus ne peut pas être lue en externe et ne peut être lue que via la méthode publique makeSound() de cat .

var cat1 = Cat.createNew();
alert(cat1.sound); // undefined
Copier après la connexion


4. Partage de données

Parfois, nous avons besoin que tous les objets d'instance puissent lire et écrire de la même manière. données internes. Pour le moment, encapsulez simplement les données internes à l’intérieur de l’objet de classe et à l’extérieur de la méthode createNew().

var Cat = {
    sound : "喵喵喵",
    createNew: function(){
      var cat = {};
      cat.makeSound = function(){ alert(Cat.sound); };
      cat.changeSound = function(x){ Cat.sound = x; };
      return cat;
    }
};
Copier après la connexion


Ensuite, générez deux objets instances :

var cat1 = Cat.createNew();
var cat2 = Cat.createNew();
cat1.makeSound(); // 喵喵喵
Copier après la connexion


À ce stade, si un objet instance modifie les données partagées, l'autre objet instance sera également affecté.

cat2.changeSound("啦啦啦");
cat1.makeSound(); // 啦啦啦
Copier après la connexion

Le minimalisme est beau, mais il présente également des inconvénients. Tout d'abord, instanceof ne peut pas être utilisé pour déterminer la classe à laquelle appartient un objet, "cat1 instanceof. Cat" ne peut pas passer. De plus, bien que le minimalisme élimine les inconvénients de l'utilisation de la chaîne de prototypes (les propriétés ne peuvent pas être privées, la création et l'héritage d'objets ne sont pas intuitifs), il expose également les inconvénients de ne pas utiliser la chaîne de prototypes : à chaque fois qu'un instance est générée, elle doit Pour le contenu répété, il occupera plus de mémoire

Le contenu ci-dessus concerne la méthode minimaliste d'écriture de JavaScript. J'espère qu'il sera utile au travail de chacun

. Recommandations associées :

JavaScript orienté objet (approche minimaliste)_js orienté objet

Méthodes de gestion des exceptions JavaScript

Simulation JavaScript Trois façons d'implémenter l'encapsulation et leurs différences

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!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Comment déverrouiller tout dans Myrise
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Recommandé : Excellent projet de détection et de reconnaissance des visages open source JS Recommandé : Excellent projet de détection et de reconnaissance des visages open source JS Apr 03, 2024 am 11:55 AM

La technologie de détection et de reconnaissance des visages est déjà une technologie relativement mature et largement utilisée. Actuellement, le langage d'application Internet le plus utilisé est JS. La mise en œuvre de la détection et de la reconnaissance faciale sur le front-end Web présente des avantages et des inconvénients par rapport à la reconnaissance faciale back-end. Les avantages incluent la réduction de l'interaction réseau et de la reconnaissance en temps réel, ce qui réduit considérablement le temps d'attente des utilisateurs et améliore l'expérience utilisateur. Les inconvénients sont les suivants : il est limité par la taille du modèle et la précision est également limitée ; Comment utiliser js pour implémenter la détection de visage sur le web ? Afin de mettre en œuvre la reconnaissance faciale sur le Web, vous devez être familier avec les langages et technologies de programmation associés, tels que JavaScript, HTML, CSS, WebRTC, etc. Dans le même temps, vous devez également maîtriser les technologies pertinentes de vision par ordinateur et d’intelligence artificielle. Il convient de noter qu'en raison de la conception du côté Web

Explication détaillée de l'héritage des fonctions C++ : Comment utiliser le « pointeur de classe de base » et le « pointeur de classe dérivé » dans l'héritage ? Explication détaillée de l'héritage des fonctions C++ : Comment utiliser le « pointeur de classe de base » et le « pointeur de classe dérivé » dans l'héritage ? May 01, 2024 pm 10:27 PM

Dans l'héritage de fonction, utilisez le « pointeur de classe de base » et le « pointeur de classe dérivée » pour comprendre le mécanisme d'héritage : lorsque le pointeur de classe de base pointe vers l'objet de classe dérivé, une transformation ascendante est effectuée et seuls les membres de la classe de base sont accessibles. Lorsqu’un pointeur de classe dérivée pointe vers un objet de classe de base, une conversion vers le bas est effectuée (dangereuse) et doit être utilisée avec prudence.

Comment l'héritage et le polymorphisme affectent-ils le couplage de classes en C++ ? Comment l'héritage et le polymorphisme affectent-ils le couplage de classes en C++ ? Jun 05, 2024 pm 02:33 PM

L'héritage et le polymorphisme affectent le couplage des classes : l'héritage augmente le couplage car la classe dérivée dépend de la classe de base. Le polymorphisme réduit le couplage car les objets peuvent répondre aux messages de manière cohérente via des fonctions virtuelles et des pointeurs de classe de base. Les meilleures pratiques incluent l'utilisation de l'héritage avec parcimonie, la définition d'interfaces publiques, l'évitement de l'ajout de données membres aux classes de base et le découplage des classes via l'injection de dépendances. Un exemple pratique montrant comment utiliser le polymorphisme et l'injection de dépendances pour réduire le couplage dans une application de compte bancaire.

Explication détaillée de l'héritage des fonctions C++ : Comment déboguer les erreurs d'héritage ? Explication détaillée de l'héritage des fonctions C++ : Comment déboguer les erreurs d'héritage ? May 02, 2024 am 09:54 AM

Conseils de débogage des erreurs d’héritage : assurez-vous que les relations d’héritage sont correctes. Utilisez le débogueur pour parcourir le code et examiner les valeurs des variables. Assurez-vous d'utiliser correctement le modificateur virtuel. Examinez le problème des diamants d'héritage causé par l'héritage caché. Recherchez les fonctions virtuelles pures non implémentées dans les classes abstraites.

La relation entre js et vue La relation entre js et vue Mar 11, 2024 pm 05:21 PM

La relation entre js et vue : 1. JS comme pierre angulaire du développement Web ; 2. L'essor de Vue.js en tant que framework front-end ; 3. La relation complémentaire entre JS et Vue ; Vue.

Explication détaillée de l'héritage des fonctions C++ : Comment comprendre la relation « est-un » et « a-un » dans l'héritage ? Explication détaillée de l'héritage des fonctions C++ : Comment comprendre la relation « est-un » et « a-un » dans l'héritage ? May 02, 2024 am 08:18 AM

Explication détaillée de l'héritage de fonction C++ : Maîtriser la relation entre "is-a" et "has-a" Qu'est-ce que l'héritage de fonction ? L'héritage de fonction est une technique en C++ qui associe des méthodes définies dans une classe dérivée à des méthodes définies dans une classe de base. Il permet aux classes dérivées d'accéder et de remplacer les méthodes de la classe de base, étendant ainsi les fonctionnalités de la classe de base. Relations « est-un » et « a-un » Dans l'héritage de fonctions, la relation « est-un » signifie que la classe dérivée est un sous-type de la classe de base, c'est-à-dire que la classe dérivée « hérite » des caractéristiques et du comportement de la classe de base. La relation « possède un » signifie que la classe dérivée contient une référence ou un pointeur vers l'objet de classe de base, c'est-à-dire que la classe dérivée « possède » l'objet de classe de base. SyntaxeVoici la syntaxe permettant d'implémenter l'héritage de fonction : classDerivedClass:pu

'Introduction à la programmation orientée objet en PHP : du concept à la pratique' 'Introduction à la programmation orientée objet en PHP : du concept à la pratique' Feb 25, 2024 pm 09:04 PM

Qu'est-ce que la programmation orientée objet ? La programmation orientée objet (POO) est un paradigme de programmation qui résume les entités du monde réel en classes et utilise des objets pour représenter ces entités. Les classes définissent les propriétés et le comportement des objets, et les objets instancient les classes. Le principal avantage de la POO est qu’elle rend le code plus facile à comprendre, à maintenir et à réutiliser. Concepts de base de la POO Les principaux concepts de la POO incluent les classes, les objets, les propriétés et les méthodes. Une classe est le modèle d'un objet, qui définit ses propriétés et son comportement. Un objet est une instance d’une classe et possède toutes les propriétés et comportements de la classe. Les propriétés sont les caractéristiques d'un objet pouvant stocker des données. Les méthodes sont des fonctions d'un objet qui peuvent opérer sur les données de l'objet. Avantages de la POO Les principaux avantages de la POO sont les suivants : Réutilisabilité : la POO peut rendre le code plus

L'ère de l'IA de JS est arrivée ! L'ère de l'IA de JS est arrivée ! Apr 08, 2024 am 09:10 AM

Introduction à JS-Torch JS-Torch est une bibliothèque JavaScript d'apprentissage en profondeur dont la syntaxe est très similaire à celle de PyTorch. Il contient un objet tensoriel entièrement fonctionnel (peut être utilisé avec des dégradés suivis), des couches et des fonctions d'apprentissage en profondeur et un moteur de différenciation automatique. JS-Torch convient à la recherche sur l'apprentissage profond en JavaScript et fournit de nombreux outils et fonctions pratiques pour accélérer le développement de l'apprentissage profond. Image PyTorch est un framework d'apprentissage profond open source développé et maintenu par l'équipe de recherche de Meta. Il fournit un riche ensemble d'outils et de bibliothèques pour créer et former des modèles de réseaux neuronaux. PyTorch est conçu pour être simple, flexible et facile à utiliser, et ses fonctionnalités de graphique de calcul dynamique font

See all articles