Objets en JavaScript

Je commence une série d'articles sur les concepts JavaScript, et ce n'est que le début. Dans ce premier article, le concept de base des objets sera exploré, essentiel pour comprendre le fonctionnement de la structure des données en JavaScript.

Restez à l'écoute des prochains posts, qui continueront cet article et plusieurs autres sujets.

---

Qu'est-ce qu'un objet ?

dans le monde réel, les objets sont des entités (réelles ou abstraites). Par exemple : crayon, voiture, cahier. Chacun de ces objets possède des propriétés spécifiques. Par exemple : une voiture bleue, un crayon rouge ou un grand cahier.

En JavaScript, les objets sont des entités indépendantes qui collectent des propriétés. Les propriétés sont des associations entre un nom et une valeur, c'est-à-dire des informations qui décrivent l'objet.

const carro = {
  cor: "amarelo",
  tamanho: "grande",
};

Dans cet exemple, la couleur et la taille sont des propriétés de l'objet voiture, et chacune d'elles a une valeur associée.

Création d'objets

Syntaxe littérale

Les objets littéraux sont créés de manière simple et directe, où les valeurs sont déjà définies manuellement. Cette syntaxe est idéale lorsque vous disposez d'un ensemble fixe de propriétés pour l'objet.

const pessoa = {
  nome: "João",
  idade: 19,
  rua: "Rua Erva Daninha",
};

Ce type d'objet est utile lorsque les propriétés ne changent pas souvent ou lorsque vous devez créer rapidement un objet avec des valeurs fixes.

Fonctions du constructeur

Les fonctions constructeur sont utilisées pour créer des objets de manière dynamique, en particulier lorsque vous avez besoin de plusieurs objets similaires. Lors de l'utilisation du mot-clé new, un nouvel objet est créé qui fait référence à la fonction constructeur.

function NomeDoConstrutor(parâmetros) {

  this.propriedade1 = valor1;
  this.propriedade2 = valor2;

  this.método = function() {
    // Código do método
  };
}

const variavel1 = new NomeDoConstrutor(parâmetros)
const variavel2 = new NomeDoConstrutor(parâmetros)

À titre d'exemple plus conventionnel et moins académique :

function Pessoa(nome, idade) {
  this.nome = nome;
  this.idade = idade;

  this.cumprimentar = function () {
    console.log("Olá, meu nome é " + this.nome);
  };
}

const pessoa1 = new Pessoa("João", 30);
const pessoa2 = new Pessoa("Maria", 25);

pessoa1.cumprimentar(); // Olá, meu nome é João
pessoa2.cumprimentar(); // Olá, meu nome é Maria

Dans ce cas, la sortie sera "Estampillée" avec les valeurs attribuées par les variables personne1 et personne2 dans le modèle stipulé par la fonction Personne.

Utilisation du mot Ceci

Au sein d'un constructeur, nous utilisons le mot-clé this pour faire référence à l'objet en cours de création. Cela vous permet de définir des propriétés et des méthodes dynamiques pour l'objet.

Par exemple, dans le code ci-dessus, this.name et this.age définissent les propriétés de l'objet, et la méthode greet est une fonction associée à l'objet.

Héritage chez les constructeurs

L'héritage en JavaScript fonctionne via des prototypes. Au lieu de créer un objet directement à partir d'un autre, vous créez une hiérarchie dans laquelle un objet peut hériter des propriétés et des méthodes d'un autre. Cela se fait en utilisant les méthodes call ou apply.

const carro = {
  cor: "amarelo",
  tamanho: "grande",
};

Comment fonctionne l'héritage ?

Lorsque nous utilisons Pessoa.call(this, nome), nous appelons le constructeur Pessoa et transmettons le contexte de l'objet Student. Cela fait que l'objet student1 hérite de la propriété name de Person et possède également la propriété age, qui est exclusive à la fonction Student.

Les fonctions constructeur sont plus utilisées lorsqu'il est nécessaire de créer plusieurs objets avec de nombreuses propriétés et méthodes avec des valeurs variables. Dans ce cas, il est préférable d'utiliser un objet constructeur comme "tampon" plutôt que d'écrire plusieurs objets manuellement.

Objets constructeur

Les objets créés à l'aide des fonctions constructeur sont des instances générées par l'opérateur new. Chaque instance possède ses propres propriétés, mais partage les méthodes définies dans le prototype de la fonction constructeur.

Cela signifie que si vous créez plusieurs objets à partir d'une fonction constructeur, ils auront les mêmes méthodes mais des valeurs différentes pour leurs propriétés.

const pessoa = {
  nome: "João",
  idade: 19,
  rua: "Rua Erva Daninha",
};

• Dans ce cas, l'opérateur new crée un nouvel objet, liant le contexte (this) à la fonction constructeur

• Pour les méthodes partagées, il est plus efficace d'ajouter le prototype de la fonction constructeur. Cela évite la duplication en mémoire.
  

function NomeDoConstrutor(parâmetros) {

  this.propriedade1 = valor1;
  this.propriedade2 = valor2;

  this.método = function() {
    // Código do método
  };
}

const variavel1 = new NomeDoConstrutor(parâmetros)
const variavel2 = new NomeDoConstrutor(parâmetros)

En définissant des méthodes dans le prototype d'une fonction constructeur, on évite la duplication de code. Au lieu que chaque objet ait une copie de la méthode, ils partagent tous la même méthode, économisant ainsi de la mémoire.

L'opérateur new crée un nouvel objet et lie le contexte (this) à la fonction constructeur.

Pour les méthodes partagées, il est plus efficace de les ajouter au prototype de la fonction constructeur, évitant ainsi la duplication en mémoire.

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!