Her er de nye indbyggede metoder og funktioner i JavaScript

I de sidste par år er JavaScript kommet med mange nye udgivelser. De har bragt nye funktioner, især i syntaksen og dens kerne. Disse opdateringer har gjort JavaScript mere læsbart og smart. Jeg vil introducere os til de nye metoder til arrays, objekter og strenge. Disse nye metoder kan håndtere data på en elegant og effektiv måde ved at skrive mindre kode. Dette forklarer vi i denne artikel.

De nye objekter metoder

Objektet er det, der gør JavaScript til et stærkt programmeringssprog. Objekter giver dig mulighed for at gruppere forskellige datatyper. Hvis du vil lære nye JavaScript-rammer som React, Vue eller Angular, skal du vide, hvordan du bruger objekter og dens metoder. Disse rammer bruger objekter til at hente og håndtere brugerinput. De nye JavaScript-udgivelser bringer nye metoder til objekter, der gør dem sjovere. Her er de nye objektmetoder:

object.assign ()

Object.assign () -metoden har flere job. Det kan kopiere et objekt, klone fra et andet objekt eller sammenkæde to eller flere objekter.

  • kopier værdierne fra et andet objekt:
  • Klon et objekt til et nyt objekt
  • Du kan også flette duplikategenskaber med Object.assign () ved at indstille to tomme parenteser som det første argument:

Object.entries ()

Metoden Object.entries () returnerer nøglerne og værdierne for objektet som en matrix.

Object.getOwnPropertyDescriptors ()

Object.getOwnPropertyDescriptors giver os mulighed for at få egenskabsbeskrivelsen til et objekt.

Det er virkelig nyttigt at kontrollere egenskaben for objektbeskriveren, for eksempel se om den er skrivbar eller kan tælles.

De nye Array-metoder

De nye JavaScript-udgivelser har leveret nye metoder til Arrays. Her er de nye matrixmetoder:

Array. Inkluderer ()

Array.includes () giver os mulighed for at kontrollere, om en ejendom findes i en matrix. Du kan se forskellen mellem den gamle kode og den nye syntaks (ES6). Den nye metode er kort og mere læselig.

Array.find ()

Array.find () hjælper os med at finde et element i en Array. Det tager en tilbagekaldsfunktion som et argument. Callback-funktionen giver flere muligheder for at finde og udtrække komplekse data.

Hvis den ejendom, vi leder efter, findes, returnerer den den fundne værdi. Ellers vender den udefineret tilbage.

Array.findIndex ()

Array.findIndex () returnerer indekset for det fundne element i stedet for værdien.

Array.values ​​()

Denne nye metode returnerer en Array-iterator af værdierne, så vi kan køre en for-loop for at udtrække hver værdi af Array.

Array.entries ()

Array.entries () returnerer både nøglen og værdien og i et Array-format.

Array.from ()

Array.from () blev introduceret i ES6-udgivelsen. Det kan gøre flere ting ved at køre en kortfunktion () på dataene. Det kan konvertere en streng til en matrix eller endda oprette en ny matrix ud fra dataene.

Array.keys ()

Som navnet antyder, returnerer denne metode nøglerne til Array.

De nye strengmetoder

De nye JavaScript-udgivelser gav nye strengmetoder. Her er de nye strengmetoder:

Streng. Gentag ()

String.repeat () -metoden giver dig mulighed for at gentage en streng.

String. Inkluderer ()

String.includes () fungerer som Array.includes (). Det returnerer en boolsk, hvis den indtastede værdi findes.

De nye nummermetoder

De nye JavaScript-udgivelser gav nye nummermetoder. Her er de nye nummermetoder:

Antal.isNaN ()

Denne metode blev frigivet i ES6-opdateringen. Det kontrollerer nummerværdien, der er sendt ind, og returnerer sand, hvis værdien er NaN. Ellers returnerer den falsk. Denne metode er inspireret af den klassiske funktion isNAN () i JavaScript.

Nummer. Er heltal ()

Ligesom den foregående metode kontrollerer Number.isInteger () for at se, om den videregivne værdi er et heltal eller ej. Det returnerer sandt, hvis værdien er et heltal og falsk, hvis den ikke er.

Antal.isSafeInteger ()

Du vil altid gerne validere brugernes input for at sikre, at det er et tal. Number.isSafeInteger () kontrollerer, om nummeret er et sikkert nummer.

Lær mere her

Antal.isFinite ()

Number.isFinite () kontrollerer, om værdien, der er sendt ind, er et endeligt tal eller ej.

Browsersupport

De nye nummermetoder understøttes næsten af ​​den store browser undtagen Opera Mini og IE-11. Support vises i nedenstående billede:

Nye specifikke objekter

JavaScript leveres med nye specifikke funktioner, der giver os mulighed for at skrive mere performant kode. Her er de nye specifikke objektmetoder:

Proxy () objekt

Proxy er en af ​​de store tilføjelser til JavaScript. Det skaber en brugerdefineret adfærd for vores kode. Med Proxy kan du håndtere:

  • validering af brugerdata
  • datakorrektion
  • ejendomssøgning
  • opgave
  • optælling
  • funktion påkaldelse

Tjek andre anvendelser af Proxy og dens metoder her.

For at forstå proxy skal vi skrive to eksempler.

Eksempel 1:

I dette eksempel validerer vi data, mens vi får dem fra en bruger. Vi vil forsøge at definere adfærden for en udefineret fejl.

Som du ser i eksemplet ovenfor returnerer userInfo.favCar undefined. Hvad hvis vi vil håndtere denne fejlmeddelelse? Hvis vi ønsker at oprette en brugerdefineret adfærd for fejlen, for eksempel ved at vise en anden meddelelse i stedet for udefineret, kan vi bruge Proxy i dette tilfælde.

Vi definerede en ny proxy og gav den to argumenter - objektet og handleren. Handleren kører en valideringskode og kontrollerer, om ejendommen findes i objektet. Det returnerer ejendommen, hvis den findes. Ellers returnerer den den besked, vi definerede, og dette kaldes egenskabsopslag.

Eksempel 2:

I dette eksempel opretter vi en validering af en bestemt værdi i objektet ved hjælp af indstillingsmetoden .

I dette eksempel kan vi validere datatypen og returnere en ny TypeError (). Dette gør fejlretning meget lettere. Du kan forstå mere med denne nyttige artikel.

Browsersupport

Proxy fungerer ret godt for alle større browsere, som du ser nedenfor:

Indstil () objekt

Set-objektet er en ny funktion i JavaScript. Det giver os mulighed for at gemme unikke værdier. Det har en masse metoder, du kan spille. Metoden Object.add giver dig mulighed for at tilføje en ny egenskab til objektet. Object.delete fjerner en egenskab fra objektet. Object.clear rydder alle egenskaber fra objektet. Eksemplet nedenfor forklarer objektmetoderne.

Lær mere om Set () -objekt her.

Afslutter

Vi dækkede lige de nye indbyggede metoder introduceret af JavaScript. Med disse nye fantastiske funktioner bruger jeg ikke den gamle syntaks og metoder længere i min kode. De nye metoder giver dig mulighed for at skrive dygtig og performant JavaScript-kode på en elegant måde.

Du kan også tjekke mine artikler om ny ES6-syntaks for at opdatere dine færdigheder i JavaScript.

Du kan finde mig på Twitter og Instagram

Tidligere artikler:

  • JavaScript ES6 - Skriv mindre, gør mere
  • Lær Bootstrap 4 på 30 minutter ved at oprette en Landing et websted
  • Vinkel 6, og det er nye funktioner, alt sammen forklaret på tre minutter
  • Sådan bruges routing i Vue.js til at skabe en bedre brugeroplevelse
  • Her er de mest populære måder at lave en HTTP-anmodning i JavaScript på
  • Lær hvordan du opretter din første Angular-app på 20 minutter