Distrutturazione dell'oggetto, parametri di riposo e sintassi di diffusione | Spiegato in JavaScript

La distruzione dell'oggetto, i parametri di riposo e la sintassi di diffusione sono tutti considerati argomenti JavaScript avanzati. Li abbatteremo in semplici passaggi comprensibili e li spiegheremo con esempi. Tutte e tre queste caratteristiche sono state introdotte in JavaScript con il rilascio di ECMAV6 JavaScript (ES6 JS)

Distrutturazione dell'oggetto

È il processo di prelevare i "valori" dalle coppie di valore chiave da un oggetto e posizionarle in singole variabili con una singola riga di codice. Questa singola riga di codice non solo assegna valori alle variabili, ma crea anche quelle variabili. Possiamo dire che stiamo dichiarando e inizializzando più variabili in una singola riga di codice con la distruzione degli oggetti.

Sintassi della distruzione degli oggetti:
Dopo la Dichiarazione variabile (const, let, var) posizionare gli identificatori delle variabili all'interno delle parentesi ricci e mettere tutta questa equazione uguale all'oggetto che vogliamo distruggere. Ricorda, il nome delle variabili dovrebbe essere uguale alla "chiave" delle coppie di valore chiave dell'oggetto.

const identifier1, identifier2, identifier3 = objectName;

Nota: non esiste un "operatore" di distruzione, tuttavia, la dichiarazione di cui sopra viene definita "operatore di assegnazione di distruzione"

Esempio:

Per dimostrare l'oggetto che distruggerà prima creeremo un oggetto in JavaScript usando le seguenti righe di codice:

telefono =
Nome: "iPhone",
Modello: '13 Pro ',
Azienda: "Apple",
Popolarità: 10

Ora che abbiamo il nostro oggetto, possiamo distruggerlo in varie variabili, con la seguente riga di codice:

const nome, modello = telefono;

Nota: stiamo solo distruggendo l'oggetto e memorizzando due valori con il tasto "nome" e "modello", ecco perché dobbiamo dare il nome dell'identificatore come le chiavi delle coppie di valore chiave.

Puoi anche accedere ai valori usando variabili come:

console.log ("Il nome del cellulare è:" + nome);
console.log ("Il modello del cellulare è:"+ modello);

Il frammento completo di codice di questo esempio è come

telefono =
Nome: "iPhone",
Modello: "13 Pro",
Azienda: "Apple",
Popolarità: 10,
;
const nome, modello = telefono;
console.log ("Il nome del cellulare è:"+nome);
console.log ("Il modello del cellulare è:"+ modello);

Otterrai il seguente output quando esegui questo codice:

Questo è tutto per la distruzione degli oggetti in Javascript ES6

Parametri di riposo

I parametri di resto vengono utilizzati quando non siamo certi di quanti parametri dovrebbe intraprendere una funzione. Solliamo il compilatore utilizzando l'operatore a tripla punto prima del nome del parametro per chiarire che si tratta di un parametro di riposo e non di un parametro normale.

I valori all'interno del parametro di resto sono memorizzati come un array sotto lo stesso identificatore del parametro stesso.

Sintassi
Come accennato in precedenza, utilizziamo un operatore a triplo punto prima dell'identificatore nei parametri di una funzione per trasformarlo in un parametro di riposo

funzione xyz (... paramidentifier) ​​
// corpo della funzione

Restrizione per la definizione dei parametri di riposo:

• Solo un parametro di riposo in una funzione.
• Deve essere l'ultimo parametro della funzione

Esempio di parametri di riposo

Per dimostrare l'uso di parametri di riposo con JavaScript creeremo una funzione semplice che riassume i numeri forniti come argomenti con le seguenti righe di codice:

Function Sum (a, b)
restituire a+b;

Come puoi vedere, questa funzione può sommare solo 2 numeri, ma vogliamo una funzione in grado di assumere una quantità indefinita di numeri e riassumerli per noi, quindi cambiamo la funzione per far sembrare questa:

Function Sum (… numeri)
risultato = 0;
per (valore dei numeri)
risultato = risultato + valore;

risultato di ritorno;

Come puoi vedere, stiamo prendendo solo 1 parametro che è il parametro di resto che consentirà a questa funzione di assumere una quantità indefinita di numeri e quindi stiamo usando il ciclo per attraversare i valori posizionati all'interno dell'array e aggiungendoli negli altri. Tutto ciò che rimane da fare è chiamare questa funzione e stampare il valore di ritorno con le seguenti righe di codice:

console.registro (somma (6, 3, 83, 55, 13, 45));
console.registro (somma (1, 2, 3));

Vedrai il seguente output sullo schermo quando esegui questo codice:

Questo è tutto per usare i parametri di riposo in JavaScript, ora possiamo passare al nostro argomento successivo.

Sintassi di diffusione

Viene utilizzato per trasmettere gli elementi di un oggetto iterabile (un array o una stringa) agli argomenti o all'elenco degli argomenti come con una singola riga di codice senza avere la necessità di ripetere manualmente quell'oggetto iterabile.

Sintassi
La sintassi della sintassi di diffusione è piuttosto semplice, utilizziamo semplicemente l'operatore a triplo punto prima del nome variabile mentre lo passiamo come un discussione.

(... argomentazione);

Esempio

Per dimostrare l'uso della sintassi di diffusione in JavaScript avremo bisogno di una funzione che possiamo creare con le seguenti righe di codice:

funzione addnumbers (a, b, c, d, e)
restituire a+b+c+d+e;

Ora che abbiamo la nostra funzione, abbiamo bisogno di un array che contenga i nostri numeri da aggiungere,

numeri = [5, 3, 1, 6, 2];

L'ultima cosa che rimane da fare è trasmettere questo array usando la sintassi di diffusione nella funzione con la seguente riga di codice:

console.log (addNumbers (… numeri));

Dovresti vedere il seguente risultato sulla tua console:

Come puoi vedere, gli elementi dell'array sono stati passati con successo alla funzione come argomenti con l'uso della sintassi di diffusione.

Parametro di riposo vs sintassi di diffusione

Spesso, gli utenti si confondono tra il Parametri di riposo e il Sintassi di diffusione per gli argomenti di passaggio. Questa confusione è creata a causa del fatto che il operatore Per entrambe queste funzionalità è la stessa (OPERATORE DOT). Per affrontare questa confusione, possiamo dire che:

• Se l'operatore dot viene utilizzato nella definizione della funzione per definire un parametro, verrà chiamato Operatore di parametri di riposo.
• D'altra parte, se questo operatore viene utilizzato mentre passano argomenti a una funzione, verrà chiamato operatore di diffusione.

Conclusione

JavaScript ha varie caratteristiche, in particolare il rilascio ECMA V6 di JavaScript ha bombardato la comunità di programmazione con molte caratteristiche utili. Alcune di queste caratteristiche sono: distruzione degli oggetti, i parametri di resto e la sintassi di diffusione. In questo post, abbiamo superato la spiegazione e l'uso di queste tre caratteristiche insieme ai loro esempi.