В този урок ще научите за оператора за разпространение на JavaScript с помощта на примери.
Операторът за разпространение е ново допълнение към функциите, налични във версията на JavaScript ES6 .
Оператор за разпространение
Операторът за разпространение … се използва за разширяване или разпространение на итерабил или масив. Например,
const arrValue = ('My', 'name', 'is', 'Jack'); console.log(arrValue); // ("My", "name", "is", "Jack") console.log(… arrValue); // My name is Jack
В този случай кодът:
console.log(… arrValue)
е еквивалентно на:
console.log('My', 'name', 'is', 'Jack');
Копиране на масив с помощта на оператор за разпространение
Можете също да използвате синтаксиса … за разпространение, за да копирате елементите в един масив. Например,
const arr1 = ('one', 'two'); const arr2 = (… arr1, 'three', 'four', 'five'); console.log(arr2); // Output: // ("one", "two", "three", "four", "five")
Клониране на масив с помощта на оператор за разпространение
В JavaScript обектите се присвояват по препратка, а не по стойности. Например,
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)
Тук и двете променливи arr1 и arr2 се отнасят към един и същ масив. Следователно промяната в една променлива води до промяна и в двете променливи.
Ако обаче искате да копирате масиви, така че да не се отнасят към същия масив, можете да използвате оператора за разпространение. По този начин промяната в единия масив не се отразява в другия. Например,
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)
Разпръснете оператора с обект
Можете също да използвате оператора за разпространение с обектни литерали. Например,
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)
Тук и двете, obj1и obj2свойствата се добавят към obj3използването на оператора за разпространение.
Параметър за почивка
Когато операторът за разпространение се използва като параметър, той е известен като параметър за почивка.
Можете също така да приемете множество аргументи в извикване на функция, като използвате параметъра rest. Например,
let func = function(… args) ( console.log(args); ) func(3); // (3) func(4, 5, 6); // (4, 5, 6)
Тук,
- Когато на
func()функцията се предаде един аргумент , параметърът rest отнема само един параметър. - Когато са предадени три аргумента, параметърът rest взема всичките три параметъра.
Забележка : Използването на параметъра rest ще предаде аргументите като елементи на масива.
Можете също така да предадете множество аргументи на функция, използвайки оператора за разпространение. Например,
function sum(x, y ,z) ( console.log(x + y + z); ) const num1 = (1, 3, 4, 5); sum(… num1); // 8
Ако предадете множество аргументи с помощта на оператора за разпространение, функцията взема необходимите аргументи и игнорира останалите.
Забележка : Операторът за разпространение е въведен в ES6 . Някои браузъри може да не поддържат разпространението на синтаксиса. Посетете поддръжката на оператора за разпространение на JavaScript, за да научите повече.
