Javascript ES6 - Esplorazione dei nuovi metodi integrati

reasonCode #codeForAReason

Tra le nuove funzionalità rilasciate con il nuovo standard ES6 in Javascript ci sono una miriade di nuovi metodi integrati. Questi nuovi metodi mirano a semplificare e standardizzare alcuni scenari familiari che gli sviluppatori incontrano quando lavorano con tipi di dati JS come Numbers, Strings, Object e Arrays.

Uno degli obiettivi di ES6 era rendere la codifica in JS più pulita e più concisa, diamo un'occhiata a come questi nuovi metodi ci aiutano a spostarci verso quell'obiettivo.

In ogni frammento di codice qui sotto vedrai:

// ES6: questa è la nuova implementazione ES6 della funzione
// ES5: questo è l'equivalente ES5 (se presente) della nuova implementazione ES6

Se ti piace questo post controlla il nostro ultimo post su Proxy di JS ES6

Assegnazione proprietà oggetto

Quando si lavora con oggetti, spesso è necessario combinare 2 o più oggetti. La nuova funzione Object.assign () fornisce un metodo pulito per fare proprio questo.

Unione oggetto

Merge Object.assign

Iniziamo con 3 oggetti sulle linee 2–4 con l'intenzione di combinarli nell'oggetto di destinazione. In ES5 è stato necessario eseguire il ciclo continuo e aggiungere in modo indipendente i valori all'oggetto di destinazione. In ES6 puoi farlo con una singola riga di codice (riga 15).

Cosa succede quando unisci oggetti con le stesse proprietà che chiedi? Vediamo.

Unisci con le stesse proprietà

Puoi anche usare Object.assign () per clonare Oggetti.

Clone oggetto

Clone Object.assign

Ricerca di elementi array

Comunemente quando si lavora con le matrici si desidera trovare un elemento OPPURE l'indice di un elemento in una matrice. ES6 fornisce 2 nuovi metodi Array find () e findIndex () per farlo. È importante notare che find () restituirà il PRIMO elemento nell'Array che soddisfa la funzione di test fornita. Diamo un'occhiata a queste nuove funzioni ES6 e ai loro equivalenti ES5 (non esiste un equivalente ES5 per findIndex ()).

La linea 7 e la linea 12 realizzano la stessa cosa, puoi vedere la semplicità nell'implementazione di ES6 sulla linea 12. Non esiste un equivalente ES5 per la linea 13 (findIndex). La riga 14 mostra la funzione findIndex () che restituisce il PRIMO elemento per soddisfare il test.

Ripetizione di stringhe

ES6 ha aggiunto un nuovo semplice metodo String.repeat ().

ripetizione di stringa

Ricerca di stringhe

ES6 ha aggiunto 3 nuovi metodi per aiutare lo sviluppatore durante la ricerca di segmenti di testo all'interno di una stringa. startWith (), limitsWith () e comprende (). Questo mi piace perché qualcosa su indexOf () mi ha sempre considerato inefficiente e soggetto a errori.

ricerca di stringhe

Verifica del tipo di numero

Esistono diverse nuove funzioni per verificare la presenza di numeri non numerici e numeri finiti. Number.isNaN () e Number.isFinite ()

controllo del tipo di numero

Ci sono diverse cose da notare qui:

  • Le differenze tra il nuovo ES6 Number.isNaN () e il globale isNaN () sono presentate abbastanza bene qui e qui.
  • L'Infinito in realtà NON è l'infinito, è un valore numerico che rappresenta l'Infinito. Il valore effettivo è 1.797693134862315E + 308. Lo stesso per -Infinity, -1.797693134862315E + 308.

Determinazione del segno numerico

ES6 introduce una nuova funzione Math.sign () per determinare il segno di un numero inclusi i casi speciali di zero con segno (-0) e non numero.

determinazione del segno di numero

Questo è tutto per i nuovi metodi integrati in ES6. Fateci sapere i vostri pensieri e domande e vi preghiamo di seguirci su Twitter. Continua dopo.

Se ti piace questo articolo, ti preghiamo di consigliarlo e condividerlo per aiutare gli altri a trovarlo!