v JavaScript, klonování pole znamená vytvoření nového pole se stejnými prvky jako původní pole. Klonování pole v JavaScriptu je užitečné, když chcete vytvořit nové pole, které má stejné prvky jako existující pole, bez úpravy původního pole.
javascript pro rozevírací seznam
Kdy klonovat pole?
Pokud chcete provádět některé operace s polem, jako je řazení, filtrování nebo mapování, ale nechcete upravovat původní pole, můžete vytvořit klon původního pole a místo toho provést operace na klonu.
- Při předávání pole funkci jako argumentu můžete chtít zajistit, aby funkce neměnila původní pole. V tomto případě můžete místo toho předat klon pole.
- Pokud chcete zachovat původní pole pro budoucí použití, můžete vytvořit klon původního pole a použít klon pro další zpracování nebo manipulaci.
- Pokud máte pole, které obsahuje objekty nebo pole jako prvky, a chcete se vyhnout úpravám původních objektů nebo polí, můžete vytvořit klon pole, se kterým budete pracovat, takže změny objektů nebo polí v klonu nebudou ovlivnit původní objekty nebo pole.
Tím pádem, klonování pole v JavaScriptu je užitečná technika pro práci s poli způsobem, který zachovává integritu původního pole a jeho prvků.
Zde jsou některé běžné případy použití pro klonování pole:
Obsah
- Kdy klonovat pole?
- Pomocí metody Array.slice().
- Pomocí operátora šíření
- Pomocí metody Array.from().
- Pomocí metody Array.concat().
- Pomocí smyčky for
- Pomocí metody Array.map().
- Použití metody Array.from() s funkcí map
- Použití metody Array.of().
- Použití metod JSON.parse() a JSON.stringify().
- Pomocí metody Object.assign().
- Použití metody Array.reduce().
Pomocí metody Array.slice().
Používáme metoda plátků k vytvoření mělké kopie pole. Tato metoda vytvoří nové pole s podmnožinou prvků z původního pole.
Příklad: Tento příklad ukazuje implementaci výše vysvětleného přístupu.
Javascript const originalArray = [1, 2, 3]; const clonedArray = originalArray.slice(); console.log(clonedArray);>
Výstup
[ 1, 2, 3 ]>
Pomocí operátora šíření
Za použití operátor šíření … je stručný a snadný způsob, jak klonovat pole v JavaScriptu. Operátor spread umožňuje rozbalit pole na jednotlivé prvky, které pak lze použít k vytvoření nového pole.
Příklad: Tento příklad ukazuje implementaci výše vysvětleného přístupu.
Javascript const originalArray = [1, 2, 3]; const clonedArray = [...originalArray]; console.log(clonedArray);>
Výstup
[ 1, 2, 3 ]>
Pomocí metody Array.from().
Za použití Array.from() metoda je další způsob, jak klonovat pole v JavaScriptu. Tato metoda vytvoří nové pole z existujícího pole pomocí volitelné mapovací funkce k transformaci hodnot v novém poli.
Příklad: Tento příklad ukazuje implementaci výše vysvětleného přístupu.
Javascript const originalArray = [1, 2, 3]; const clonedArray = Array.from(originalArray); console.log(clonedArray);>
Výstup
[ 1, 2, 3 ]>
Pomocí metody Array.concat().
Za použití Array.concat() metoda je další způsob, jak klonovat pole v JavaScriptu. Tato metoda vytvoří nové pole zřetězením dvou nebo více polí dohromady.
Příklad: Tento příklad ukazuje implementaci výše vysvětleného přístupu.
Javascript const originalArray = [1, 2, 3]; const clonedArray = [].concat(originalArray); console.log(clonedArray);>
Výstup
[ 1, 2, 3 ]>
Pomocí smyčky for
Tato metoda zahrnuje iteraci každého prvku v původním poli a zkopírování každého prvku do nového pole.
Příklad: Tento příklad ukazuje implementaci výše vysvětleného přístupu.
Javascript const originalArray = [1, 2, 3]; const clonedArray = []; for (let i = 0; i < originalArray.length; i++) { clonedArray.push(originalArray[i]); } console.log(clonedArray);> Výstup
[ 1, 2, 3 ]>
Pomocí metody Array.map().
Za použití Array.map() metoda je další způsob, jak klonovat pole v JavaScriptu. Tato metoda vytvoří nové pole mapováním každého prvku z původního pole na novou hodnotu.
Příklad: Tento příklad ukazuje implementaci výše vysvětleného přístupu.
Javascript const originalArray = [1, 2, 3]; const clonedArray = originalArray.map(x =>X); console.log(clonedArray);>
Výstup
[ 1, 2, 3 ]>
Použití metody Array.from() s funkcí map
Za použití Array.from() metoda s mapovou funkcí je další způsob, jak klonovat pole v JavaScriptu. Tato metoda vytvoří nové pole mapováním každého prvku z původního pole na novou hodnotu pomocí poskytnuté funkce.
Příklad: Tento příklad ukazuje implementaci výše vysvětleného přístupu.
Javascript const originalArray = [1, 2, 3]; const clonedArray = Array.from(originalArray, x =>X); console.log(clonedArray);>
Výstup
[ 1, 2, 3 ]>
Použití metody Array.of().
Tato metoda vytvoří nové pole se stejnými prvky jako původní pole.
Příklad: Tento příklad ukazuje implementaci výše vysvětleného přístupu.
Javascript const originalArray = [1, 2, 3]; const clonedArray = Array.of(...originalArray); console.log(clonedArray);>
Výstup
[ 1, 2, 3 ]>
Použití metod JSON.parse() a JSON.stringify().
Za použití JSON.parse() a JSON.stringify() metody je další způsob, jak klonovat pole v JavaScriptu. Tato metoda zahrnuje převod původního pole na řetězec JSON a následnou analýzu řetězce JSON za účelem vytvoření nového pole.
Příklad: Tento příklad ukazuje implementaci výše vysvětleného přístupu.
Javascript const originalArray = [1, 2, 3]; const clonedArray = JSON.parse(JSON.stringify(originalArray)); console.log(clonedArray);>
Výstup
[ 1, 2, 3 ]>
Pomocí metody Object.assign().
Za použití Object.assign() metoda je další způsob, jak klonovat pole v JavaScriptu. Tato metoda vytvoří nové pole zkopírováním vlastností původního pole do nového objektu.
Příklad: Tento příklad ukazuje implementaci výše vysvětleného přístupu.
Javascript const originalArray = [1, 2, 3]; const clonedArray = Object.assign([], originalArray); console.log(clonedArray);>
Výstup
[ 1, 2, 3 ]>
Použití metody Array.reduce().
The Metoda Array.reduce(). provádí redukční funkci na každém prvku pole, výsledkem je jediná výstupní hodnota. Můžeme jej použít k vytvoření nového pole se stejnými prvky jako původní pole.
Syntax:
array.reduce((accumulator, currentValue, currentIndex, array) =>{ ... }, initialValue);>Příklad : V tomto příkladu použijeme metodu Array.reduce() k vytvoření klonu pole.
JavaScript // Input array const originalArray = [1, 2, 3, 4]; // Cloning the array using reduce const clonedArray = originalArray.reduce((acc, val) =>{ acc.push(val); návrat acc; }, []); // Zobrazení původního a klonovaného pole console.log('Original Array:', originalArray); // Výstup: [1, 2, 3, 4] console.log('Cloned Array:', clonedArray); // Výstup: [1, 2, 3, 4]> Výstup
Original Array: [ 1, 2, 3, 4 ] Cloned Array: [ 1, 2, 3, 4 ]>
Poznámka: Při klonování pole je tedy důležité zvážit složitost dat a požadavky na výkon aplikace.