Cette page a été traduite à partir de l'anglais par la communauté.Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
L'opérateur new
Baseline Widely available
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.
L'opérateurnew permet de créer une instance d'un certain type d'objet à partir du constructeur qui existe pour celui-ci (natif ou défini par l'utilisateur).
Le mot-clénew, utilisé avec une fonction, applique les 4 étapes suivantes :
- Il crée un nouvel objet à partir de zéro
- Il lie cet objet à un autre objet en le définissant comme son prototype.
- Le nouvel objet, créé à l'étape 1, est passé comme valeur
thisà la fonction - Si la fonction ne renvoie pas d'objet, c'est la valeur
thisqui est renvoyée.
Dans cet article
Exemple interactif
function Car(make, model, year) { this.make = make; this.model = model; this.year = year;}const car1 = new Car("Eagle", "Talon TSi", 1993);console.log(car1.make);// Expected output: "Eagle"Syntaxe
new constructeur[([arguments])];Paramètres
constructeurUne fonction ou une classe qui définit le type de l'objet qui sera une instance.
argumentsUne liste de valeurs correspondant aux arguments avec lesquels appeler le
constructeur.
Description
La création d'un objet personnalisé se fait en deux étapes :
- Définition du type d'objet en écrivant une fonction.
- Création d'une instance de l'objet avec
new.
Pour définir un type d'objet, créez une fonction pour ce type qui spécifie son nom, ses propriétés et ses méthodes. Un objet peut avoir des propriétés qui sont elles-mêmes des objets, comme on pourra le voir dans les exemples ci-dessous.
Lorsque le codenew Toto(...) est exécuté, voici ce qui se passe :
- Un nouvel objet est créé qui hérite de
Toto.prototype. - La fonction constructrice
Totoest appelée avec les arguments fournis,thisétant lié au nouvel objet créé.new Totosera équivalent ànew Toto()(i.e. un appel sans argument). - L'objet renvoyé par le constructeur devient le résultat de l'expression qui contient
new. Si le constructeur ne renvoie pas d'objet de façon explicite, l'objet créé à l'étape 1 sera utilisé. (En général, les constructeurs ne renvoient pas de valeurs mais si on souhaite surcharger le processus habituel, on peut utiliser cette valeur de retour).
Il est toujours possible d'ajouter une propriété à un objet défini précédemment. Par exemple, l'instructionvoiture1.couleur = "noir" ajoute une propriété couleur àvoiture1, et lui assigne une valeur : "noir". Cependant, ceci n'affecte aucunement les autres objets. Pour ajouter une nouvelle propriété à tous les objets du même type, cette propriété doit être ajoutée à la définition du type d'objetVoiture.
Il est possible d'ajouter une propriété partagée par tous les objets d'un type déjà défini auparavant en utilisant sa propriétéFunction.prototype. Ceci permet de définir une propriété partagée par tous les objets créés avec cette fonction, plutôt que simplement par une seule instance de ce type d'objet. Le code qui suit ajoute une propriété couleur avec la valeur"couleur standard" à tous les objets de typeVoiture, et redéfinit ensuite cette valeur avec la chaîne "noir" uniquement pour l'instance d'objetvoiture1. Pour plus d'informations, voir la page surprototype.
function Voiture() {}voiture1 = new Voiture();voiture2 = new Voiture();console.log(voiture1.couleur); // undefinedVoiture.prototype.couleur = "couleur standard";console.log(voiture1.couleur); // couleur standardvoiture1.couleur = "noir";console.log(voiture1.couleur); // noirconsole.log(voiture1.__proto__.couleur); // couleur standardconsole.log(voiture2.__proto__.couleur); // couleur standardconsole.log(voiture1.couleur); // noirconsole.log(voiture2.couleur); // couleur standardNote :Si on n'écrit pas l'appel du constructeur avec l'opérateurnew, le constructeur est appelé comme une fonction normale et ne crée pas d'objet. Dans ce cas, la valeur dethis sera différente.
Exemples
>Exemple : type d'objet et instance d'objet
Supposons que vous vouliez créer un type d'objet pour les voitures. Vous voulez que ce type d'objet s'appelleVoiture, et qu'il ait des propriétés pour la marque, le modèle et l'année. Pour ce faire, vous écririez la fonction suivante :
function Voiture(marque, modèle, année) { this.marque = marque; this.modèle = modèle; this.année = année;}À présent, vous pouvez créer un objet appeléma_voiture de la manière suivante :
ma_voiture = new Voiture("Volkswagen", "Golf TDi", 1997);Cette instruction crée l'objetma_voiture et assigne les valeurs spécifiées à ses propriétés. La valeur dema_voiture.marque est alors la chaîne"Volkswagen", celle dema_voiture.année est l'entier 1997, et ainsi de suite.
Il est possible de créer un nombre illimité d'objetsVoiture en appelantnew. Par exemple :
voiture_de_ken = new Voiture("Nissan", "300ZX", 1992);Exemple : propriété d'objet qui est elle-même un autre objet
Supposons que vous ayez défini un objet appeléPersonne de la manière suivante :
function Personne(nom, age, surnom) { this.nom = nom; this.age = age; this.surnom = surnom;}Et que vous avez ensuite instancié deux nouveaux objetsPersonne de la manière suivante :
rand = new Personne("Rand McNally", 33, "Randy");ken = new Personne("Ken Jones", 39, "Kenny");Vous pouvez alors réécrire la définition deVoiture pour contenir une propriétépropriétaire qui reçoit un objetPersonne, comme ceci :
function Voiture(marque, modèle, année, propriétaire) { this.marque = marque; this.modèle = modèle; this.année = année; this.propriétaire = propriétaire;}Pour instancier les nouveaux objets, vous utiliserez ensuite :
voiture1 = new Voiture("Volkswagen", "Golf TDi", 1997, rand);voiture2 = new Voiture("Nissan", "300ZX", 1992, ken);Plutôt que de passer une chaîne littérale ou une valeur entière lors de la création des nouveaux objets, les instructions ci-dessus utilisent les objetsrand etken comme paramètres pour les propriétaires. Pour connaître le nom du propriétaire devoiture2, on peut alors accéder à la propriété suivante :
voiture2.propriétaire.nom;Spécifications
| Specification |
|---|
| ECMAScript® 2026 Language Specification> # sec-new-operator> |