hideout-lastation.com
JavaScript orienté objet (OOJS): 3 façons de créer des instances d'objet
Quand un langage de programmation est tout sur les objets, la première chose que nous devons apprendre est de savoir comment créer des objets . Créer des objets en JavaScript est assez facile: une paire d'accolades fera le travail, mais ce n'est pas la seule façon de créer un objet ni la seule façon dont vous aurez besoin d'utiliser.
En JavaScript, les instances d'objets sont créées à partir d'objets intégrés et apparaissent lorsque le programme est en cours d'exécution. Par exemple, Date est un objet intégré qui nous donne des informations sur les dates. Si nous voulons afficher la date actuelle sur une page, nous avons besoin d'une instance d'exécution de Date contenant les informations sur la date actuelle.
JavaScript nous permet également de définir nos propres objets qui peuvent produire leurs propres instances d'objets en cours d'exécution. En JavaScript, tout est un objet et chaque objet a un ancêtre ultime appelé Object . La création d'une instance d'objet est appelée instanciation .
1. Le new opérateur
L'une des méthodes les plus courantes et les plus connues pour créer une nouvelle instance d'objet consiste à utiliser le new opérateur .
Vous avez besoin d'un constructeur pour que le new opérateur fonctionne. Un constructeur est une méthode d'un objet qui met en place une nouvelle instance de cet objet . Sa syntaxe de base ressemble à ceci:
nouveau constructeur ()
Un constructeur peut accepter des arguments qui peuvent être utilisés pour modifier ou ajouter des propriétés à l'instance d'objet qu'il construit. Le constructeur a le même nom que l'objet auquel il appartient.
Voici un exemple de création d'une instance de l'objet Date() avec le new mot-clé:
dt = new Date (2017, 0, 1) console.log (dt) // dim. 01 janv. 2017 00:00:00 GMT + 0100
Date() est le constructeur pour créer un nouvel objet Date . Différents constructeurs d'un objet prennent différents arguments pour créer le même type d'instances d'objets avec des attributs variés .
Tous les objets intégrés dans JavaScript ne peuvent pas être instanciés comme Date . Il y a des objets qui ne viennent pas avec un constructeur : Math, JSON et Reflect, mais ce sont toujours des objets ordinaires.
Parmi les objets intégrés qui ont un ou plusieurs constructeurs, Symbol ne peut pas être appelé dans le style du constructeur pour instancier une nouvelle instance de Symbol . Il peut seulement être appelé comme une fonction qui retourne une nouvelle valeur de Symbol .
De plus, parmi les objets intégrés qui ont un ou plusieurs constructeurs, tous n'ont pas besoin d'appeler leurs constructeurs avec le new opérateur pour être instanciés. Function, Array, Error et RegExp peuvent également être appelés en tant que fonctions, sans utiliser le new mot-clé, et ils vont instancier et retourner une nouvelle instance d'objet.
2. L'objet Reflect
Les programmeurs backend peuvent déjà être familiarisés avec les API Reflection . La réflexion est une fonctionnalité des langages de programmation pour inspecter et mettre à jour certaines des entités de base, telles que les objets et les classes, lors de l'exécution .
En JavaScript, vous pouvez déjà effectuer des opérations de réflexion en utilisant Object . Mais, une API Reflection appropriée est finalement apparue en JavaScript.
L'objet Reflect dispose d'un ensemble de méthodes pour créer et mettre à jour des instances d'objet . L'objet Reflect n'a pas de constructeur, donc il ne peut pas être instancié avec le new opérateur, et, tout comme Math et JSON, il ne peut pas non plus être appelé en tant que fonction .
Cependant, Reflect a un équivalent du new opérateur : la méthode Reflect.construct() .
Reflect.construct (target, argumentsList [, newTarget])
Les arguments target et newTarget optionnels sont des objets ayant leurs propres constructeurs, tandis que argumentsList est une liste d'arguments à transmettre au constructeur de target .
var dt = Reflect.construct (Date, [2017, 0, 1]); console.log (dt); // dim. 01 janv. 2017 00:00:00 GMT + 0100
Le code ci-dessus a le même effet que l'instanciation de Date() utilisant le new opérateur. Bien que vous puissiez toujours utiliser new, Reflection est une norme ECMAScript 6 . Il vous permet également d' utiliser l'argument newTarget, ce qui est un autre avantage par rapport au new opérateur.
La valeur du newTarget de newTarget (pour être exact, c'est le prototype du constructeur newTarget ) devient le prototype de l'instance nouvellement créée .
Un prototype est la propriété d'un objet, dont la valeur est également un objet, portant les propriétés de l'objet original. En bref, un objet tire ses membres de son prototype.
Ici, voyons un exemple:
class A {constructor () {this.message = fonction () {console.log ('message de A')}}} classe B {constructor () {} message () {console.log ('message de B') } data () {console.log ('données de B')}} obj = Reflect.construct (A, [], B) console.log (obj.message ()); // message de A console.log (obj.data ()); // données de B console.log (obj instanceof B) // true En passant B comme troisième argument de Reflect.construct(), la valeur prototype de l'objet obj est identique à celle du prototype du constructeur de B (qui a les propriétés message et data ).
Ainsi, obj peut accéder au message et aux data, disponibles sur son prototype. Mais, puisque obj est fait en utilisant A, il a aussi son propre message qu'il a reçu de A
Même si obj est construit en tant que tableau, ce n'est pas une instance de Array, car son prototype est défini sur Object .
obj = Reflect.construct (Tableau, [1, 2, 3], Objet) console.log (obj) // Tableau [1, 2, 3] console.log (obj instanceof tableau) // false
Reflect.construct() peut être utile lorsque vous souhaitez créer un objet en utilisant plusieurs plans .
3. La méthode Object.create()
Vous pouvez également créer un nouvel objet ordinaire avec un prototype spécifique via Object.create() . Cela peut aussi sembler très similaire à l'utilisation du new opérateur, mais ce n'est pas le cas.
Object.create (O [, propertiesObject])
L'argument O est un objet qui sert de prototype pour le nouvel objet qui sera créé. L'argument facultatif propertiesObject est une liste de propriétés que vous pouvez ajouter au nouvel objet.
class A {constructor () {} message () {console.log ('message de A')}} var obj = Object.create (nouveau A (), {data: {inscriptible: vrai, configurable: vrai, valeur: function () {retourne 'data from obj'}}}) console.log (obj.message ()) // message de A console.log (obj.data ()) // data de obj obj1 = Object.create ( new A (), {foo: {inscriptible: vrai, configurable: vrai, valeur: function () {return 'foo de obj1'}}}) console.log (obj1.message ()) // message d'une console. log (obj1.foo ()) // foo de obj1 Dans l'objet obj, la propriété ajoutée est data, alors que dans obj1, c'est foo . Donc, comme vous le voyez, nous pouvons avoir des propriétés et des méthodes ajoutées à un nouvel objet .
C'est génial quand vous voulez créer plusieurs objets du même type mais avec des propriétés ou des méthodes supplémentaires différentes . La syntaxe Object.create() évite de les coder tous séparément.
Le guide des débutants sur le CSS Object Model (CSSOM)
Il se passe beaucoup de choses entre la première requête HTTP et la livraison finale d'une page Web. La transmission de données et le pipeline de rendu du navigateur requièrent beaucoup de technologies différentes, dont le CSS Object Model ou le CSSOM .Le CSS Object Model prend le code CSS, et rend chaque sélecteur dans une structure arborescente pour faciliter l'analyse. Peut
16 mots modernes aux origines les plus inquiétantes
Vous êtes-vous déjà interrogé sur l'origine de certains mots modernes que vous lisez sur Internet ou que vous utilisez fréquemment? Je sais que je le fais. Maintenant, allez-y, appelez-moi un "mot-ballot", mais voici comment je sais beaucoup de choses cool, comme le fait que beaucoup de mots que nous utilisons aujourd'hui en les pensant comme très vingt et unième siècle, ont été en fait d' origine il y a quelque temps dans les endroits les plus mystérieux .Fondamenta
