Exemples puissants d'affectations de déstructuration en JavaScript

L'affectation de déstructuration est un sucre syntaxique introduit dans ES6 qui vous permet de décompresser les valeurs de tableaux ou d'objets en variables. Cela peut considérablement simplifier votre code et le rendre plus lisible.

Tableaux de déstructuration

Exemple de base :

const numbers = [1, 2, 3, 4];
const [first, second, ...rest] = numbers;

console.log(first); // Output: 1
console.log(second); // Output: 2
console.log(rest); // Output: [3, 4]

• Saut d'éléments : Vous pouvez ignorer des éléments en utilisant des virgules :

const [first, , third] = numbers;
console.log(first, third); // Output: 1 3

• Tableaux imbriqués : La déstructuration peut être appliquée aux tableaux imbriqués :

const nestedArray = [[1, 2], [3, 4]];
const [[a, b], [c, d]] = nestedArray;
console.log(a, b, c, d); // Output: 1 2 3 4

Objets déstructurants

Exemple de base :

const person = { name: 'Alice', age: 30, city: 'New York' };
const { name, age, city } = person;

console.log(name, age, city); // Output: Alice 30 New York

• Renommer les propriétés : Vous pouvez renommer les propriétés lors de la déstructuration :

const { name: firstName, age, city } = person;
console.log(firstName, age, city); // Output: Alice 30 New York

• Valeurs par défaut : Fournissez des valeurs par défaut pour les propriétés qui pourraient manquer :

const { name, age = 25, city } = person;
console.log(name, age, city); // Output: Alice 30 New York

• Objets imbriqués : Déstructurer les objets imbriqués :

const person = { name: 'Alice', address: { street: '123 Main St', city: 'New York' } };
const { name, address: { street, city } } = person;
console.log(name, street, city); // Output: Alice 123 Main St New York

Échanger des variables

La déstructuration peut être utilisée pour échanger des variables de manière concise :

let a = 10;
let b = 20;

[a, b] = [b, a];

console.log(a, b); // Output: 20 10

Paramètres de la fonction de déstructuration

Vous pouvez déstructurer les paramètres des fonctions pour les rendre plus lisibles :

function greet({ name, age }) {
  console.log(`Hello, ${name}! You are ${age} years old.`);
}

greet({ name: 'Alice', age: 30 });

En utilisant efficacement l'affectation de déstructuration, vous pouvez écrire du code JavaScript plus propre, plus concis et plus lisible.

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!