Un examen approfondi des objets en JavaScript / Blogs / Perficient

Bases des objets en JavaScript

JavaScript est un langage basé sur les objets ; ses objets sont constitués d’attributs.

Si un attribut contient une fonction, il est considéré comme une méthode ; sinon, c’est une propriété.

JavaScript fournit des objets et des tableaux pour rassembler et faire référence à des ensembles de données associés sous un seul nom.

Comment créer un objet en JavaScript

Il existe plusieurs manières de créer un objet en JavaScript :

1. Littéral

La liste des propriétés et des valeurs entourées d’accolades, de propriété et de valeur est séparée par : (deux-points), également appelé initialiseur d’objet.

let employee = { id: 1001, name: "Neil Hanks", contact: 9876543210 };

2. Exemple

Étant donné que le nouvel objet peut hériter des propriétés et des méthodes de l’objet prototype, nous pouvons créer un nouvel objet en utilisant un objet existant comme prototype à l’aide du nouveau mot-clé.

let employee = new Object();
  employee.id = 1001;
  employee.name = "Neil Hanks";
  employee.contact = 9876543210;

3. Constructeur

Nous pouvons utiliser la fonction constructeur pour créer et initialiser des objets, créer une fonction constructeur avec des paramètres et attribuer des valeurs à sa propriété par ce mot-clé à l’intérieur de la fonction.

function employee(id, name, contact) {
   this.id = id;
   this.name = name;
   this.contact = contact;
}

let emp = new employee(1001, "Neil Hanks", 9876543210);

Méthodes en JavaScript

Les méthodes sont des propriétés d’objet avec des fonctions. Ils peuvent également faire partie de l’objet lors de sa création ou de son ajout ultérieur, comme les propriétés.

// constructor function

function Person () {
  this.name = "John",
  this.age = 23,

   this.greet = function () {
      console.log("hello");
  }
}

Accéder aux propriétés à partir d’un objet

Comme Java, les propriétés d’un objet sont accessibles à l’aide de la notation par points.

employee.name;

// Output : Neil Hanks

Nous pouvons également accéder à la propriété de manière dynamique en utilisant la notation entre crochets, également appelée propriété calculée.

employee[“name”];

// Output : Neil Hanks

La deuxième méthode présente l’avantage que le nom de la propriété est fourni sous forme de chaîne, ce qui signifie qu’il peut être calculé au moment de l’exécution. Il peut également être utilisé pour définir et obtenir des propriétés avec des mots réservés.

Obtenir les valeurs d’un objet

En utilisant la méthode Object.values(), nous pouvons renvoyer un tableau des valeurs d’un objet.

const employee = {
  id: 1001,
  name: "Neil Hanks",
  contact: 9876543210,
};

const emp1 = Object.values(employee);
console.log(emp1) //[1001, "Neil Hanks", 9876543210]

Obtenir les clés d’un objet

En utilisant la méthode Object.keys(), nous pouvons renvoyer un tableau des clés d’un objet.

const employee = {
  id: 1001,
  name: "Neil Hanks",
  contact: 9876543210,
};

const emp1 = Object.keys(employee);
console.log(emp1) //["id", "name", "contact"]

Entrées de tableau à partir d’un objet

En utilisant Object. méthode inputs(), nous pouvons créer un tableau qui contient des tableaux de paires clé/valeur d’un objet

const employee = {
  id: 1001,
  name: "Neil Hanks",
  contact: 9876543210,
};

const emp = Object.entries(employee);
console.log(emp)
//[["id", 1001], ["name", "Neil Hanks"], ["contact", 9876543210]]

Fusionner deux objets en JavaScript

La fusion de deux objets par l’opérateur spread renvoie un nouvel objet.

const employee = {
  id: 1001,
  name: "Neil Hanks",
  contact: 9876543210,
};

const newEmp = {
  ...employee,
  location: "India"
}

console.log(newEmp)

//output
newEmp = {
  id: 1001,
  name: "Neil Hanks",
  contact: 9876543210,
  location: "India"
};

Combiner deux objets

const employee = {
  id: 1001,
  name: "Neil Hanks",
  contact: 9876543210,
};

const emp1newVal = {
  location: "India"
}

const combineObj = Object.assign(employee, emp1newVal)
console.log(combineObj)

//output
combineObj = {
  id: 1001,
  name: "Neil Hanks",
  contact: 9876543210,
  location: "India"
};

Geler des objets

1. Utilisez : Object.freeze()

En utilisant cette méthode, nous pouvons geler un objet, empêchant la modification des propriétés existantes ou ajoutant de nouvelles propriétés et valeurs.

const employee = {
  id: 1001,
  name: "Neil Hanks",
  contact: 9876543210,
};

Object.freeze(employee);
employee.name="Tom";
console.log(user1.name) //"Neil Hanks"

2. Objet gelé ou non : Object.isFrozen()

En utilisant cette méthode, nous pouvons déterminer si un objet est gelé ou non, et elle renvoie une valeur booléenne.

const employee = {
  id: 1001,
  name: "Neil Hanks",
  contact: 9876543210,
};

console.log(Object.isFrozen(employee)) // false
Object.freeze(employee)
console.log(Object.isFrozen(employee)) // ture

Sceller un objet

1. Utilisez : Object.seal()

Cette méthode peut être utilisée pour empêcher l’ajout de nouvelles propriétés, mais les valeurs des propriétés actuelles peuvent toujours être modifiées si elles sont accessibles en écriture.

const employee = {
  id: 1001,
  name: "Neil Hanks",
  contact: 9876543210,
};

Object.seal(employee);

employee.age="Tom";

console.log(employee.name) //"Tom"

employee.age = 26;

console.log(employee.age) //undefined

2. Objet scellé ou non : Object.isSealed()

En utilisant cette méthode, nous pouvons déterminer si un objet est scellé ou non et renvoie une valeur booléenne.

const employee = {
  id: 1001,
  name: "Neil Hanks",
  contact: 9876543210,
};

console.log(Object.isSealed(employee)) //false

Object.seal(employee);

console.log(Object.isSealed(employee)) // ture