I denne veiledningen vil du lære om JavaScript-spredningsoperatør ved hjelp av eksempler.
Spredningsoperatøren er et nytt tillegg til funksjonene som er tilgjengelige i JavaScript ES6- versjonen.
Spred operatør
Spredningsoperatøren … brukes til å utvide eller spre en iterabel eller en matrise. For eksempel,
const arrValue = ('My', 'name', 'is', 'Jack'); console.log(arrValue); // ("My", "name", "is", "Jack") console.log(… arrValue); // My name is Jack
I dette tilfellet koden:
console.log(… arrValue)
tilsvarer:
console.log('My', 'name', 'is', 'Jack');
Kopier Array ved hjelp av Spread Operator
Du kan også bruke den spredte syntaksen … til å kopiere elementene til en enkelt matrise. For eksempel,
const arr1 = ('one', 'two'); const arr2 = (… arr1, 'three', 'four', 'five'); console.log(arr2); // Output: // ("one", "two", "three", "four", "five")
Clone Array ved hjelp av Spread Operator
I JavaScript tildeles objekter ved referanse og ikke etter verdier. For eksempel,
let arr1 = ( 1, 2, 3); let arr2 = arr1; console.log(arr1); // (1, 2, 3) console.log(arr2); // (1, 2, 3) // append an item to the array arr1.push(4); console.log(arr1); // (1, 2, 3, 4) console.log(arr2); // (1, 2, 3, 4)
Her refererer begge variablene arr1 og arr2 til samme matrise. Derfor gir endringen i en variabel endring i begge variablene.
Men hvis du vil kopiere matriser slik at de ikke refererer til samme matrise, kan du bruke spredningsoperatøren. På denne måten gjenspeiles ikke endringen i den ene matrisen i den andre. For eksempel,
let arr1 = ( 1, 2, 3); // copy using spread syntax let arr2 = (… arr1); console.log(arr1); // (1, 2, 3) console.log(arr2); // (1, 2, 3) // append an item to the array arr1.push(4); console.log(arr1); // (1, 2, 3, 4) console.log(arr2); // (1, 2, 3)
Spred operatør med objekt
Du kan også bruke spredningsoperatøren med objektlitteratur. For eksempel,
const obj1 = ( x : 1, y : 2 ); const obj2 = ( z : 3 ); // add members obj1 and obj2 to obj3 const obj3 = (… obj1,… obj2); console.log(obj3); // (x: 1, y: 2, z: 3)
Her legges både obj1og obj2egenskaper til obj3ved bruk av spredningsoperatøren.
Hvileparameter
Når spredningsoperatøren brukes som parameter, er den kjent som restparameteren.
Du kan også godta flere argumenter i en funksjonsanrop ved hjelp av restparameteren. For eksempel,
let func = function(… args) ( console.log(args); ) func(3); // (3) func(4, 5, 6); // (4, 5, 6)
Her,
- Når et enkelt argument sendes til
func()funksjonen, tar restparameteren bare én parameter. - Når tre argumenter sendes, tar restparameteren alle tre parametrene.
Merk : Bruk av restparameteren vil overføre argumentene som matriseelementer.
Du kan også overføre flere argumenter til en funksjon ved hjelp av spredningsoperatøren. For eksempel,
function sum(x, y ,z) ( console.log(x + y + z); ) const num1 = (1, 3, 4, 5); sum(… num1); // 8
Hvis du sender flere argumenter ved hjelp av spredningsoperatoren, tar funksjonen de nødvendige argumentene og ignorerer resten.
Merk : Spreadoperatør ble introdusert i ES6 . Noen nettlesere støtter kanskje ikke bruk av spredt syntaks. Besøk JavaScript Spread Operator-støtte for å lære mer.
