W JavaScript, klonowanie tablicy oznacza utworzenie nowej tablicy z tymi samymi elementami, co tablica oryginalna. Klonowanie tablicy w JavaScript jest przydatne, gdy chcesz utworzyć nową tablicę zawierającą te same elementy, co istniejąca tablica, bez modyfikowania oryginalnej tablicy.
Kiedy klonować tablicę?
Jeśli chcesz wykonać pewne operacje na tablicy, takie jak sortowanie, filtrowanie lub mapowanie, ale nie chcesz modyfikować oryginalnej tablicy, możesz utworzyć klon oryginalnej tablicy i zamiast tego wykonać operacje na klonie.
- Przekazując tablicę do funkcji jako argument, warto upewnić się, że funkcja nie modyfikuje oryginalnej tablicy. W takim przypadku zamiast tego możesz przekazać klon tablicy.
- Jeśli chcesz zachować oryginalną tablicę do wykorzystania w przyszłości, możesz utworzyć klon oryginalnej tablicy i użyć go do dalszego przetwarzania lub manipulacji.
- Jeśli masz tablicę zawierającą obiekty lub tablice jako elementy i chcesz uniknąć modyfikowania oryginalnych obiektów lub tablic, możesz utworzyć klon tablicy, z którą będziesz pracować, tak aby zmiany w obiektach lub tablicach w klonie nie powodowały wpływać na oryginalne obiekty lub tablice.
Zatem, klonowanie tablicy w JavaScript to przydatna technika pracy z tablicami w sposób zachowujący integralność oryginalnej tablicy i jej elementów.
Oto kilka typowych przypadków użycia klonowania tablicy:
Spis treści
różnica między firmą a firmą
- Kiedy klonować tablicę?
- Korzystanie z metody Array.slice().
- Korzystanie z operatora rozprzestrzeniania
- Korzystanie z metody Array.from().
- Korzystanie z metody Array.concat().
- Korzystanie z pętli for
- Korzystanie z metody Array.map().
- Użycie metody Array.from() z funkcją mapową
- Korzystanie z metody Array.of().
- Korzystanie z metod JSON.parse() i JSON.stringify().
- Korzystanie z metody Object.sign().
- Korzystanie z metody Array.reduce().
Korzystanie z metody Array.slice().
Używamy metoda plasterków aby utworzyć płytką kopię tablicy. Ta metoda tworzy nową tablicę z podzbiorem elementów z oryginalnej tablicy.
Przykład: Ten przykład pokazuje implementację opisanego powyżej podejścia.
JavaScript const originalArray = [1, 2, 3]; const clonedArray = originalArray.slice(); console.log(clonedArray);>
Wyjście
[ 1, 2, 3 ]>
Korzystanie z operatora rozprzestrzeniania
Używając operatora spreadu … to zwięzły i łatwy sposób klonowania tablicy w JavaScript. Operator spread umożliwia rozwinięcie tablicy na pojedyncze elementy, które można następnie wykorzystać do utworzenia nowej tablicy.
Przykład: Ten przykład pokazuje implementację opisanego powyżej podejścia.
zmiana nazwy katalogu LinuxJavaScript
const originalArray = [1, 2, 3]; const clonedArray = [...originalArray]; console.log(clonedArray);>
Wyjście
[ 1, 2, 3 ]>
Korzystanie z metody Array.from().
Używając Tablica.z() metoda to kolejny sposób klonowania tablicy w JavaScript. Ta metoda tworzy nową tablicę z istniejącej tablicy przy użyciu opcjonalnej funkcji mapowania w celu przekształcenia wartości w nowej tablicy.
Przykład: Ten przykład pokazuje implementację opisanego powyżej podejścia.
JavaScript const originalArray = [1, 2, 3]; const clonedArray = Array.from(originalArray); console.log(clonedArray);>
Wyjście
[ 1, 2, 3 ]>
Korzystanie z metody Array.concat().
Używając Tablica.concat() metoda to kolejny sposób klonowania tablicy w JavaScript. Ta metoda tworzy nową tablicę poprzez połączenie dwóch lub większej liczby tablic.
Przykład: Ten przykład pokazuje implementację opisanego powyżej podejścia.
JavaScript const originalArray = [1, 2, 3]; const clonedArray = [].concat(originalArray); console.log(clonedArray);>
Wyjście
[ 1, 2, 3 ]>
Korzystanie z pętli for
Metoda ta polega na iteracji po każdym elemencie oryginalnej tablicy i kopiowaniu każdego elementu do nowej tablicy.
sortować listę tablic
Przykład: Ten przykład pokazuje implementację opisanego powyżej podejścia.
JavaScript const originalArray = [1, 2, 3]; const clonedArray = []; for (let i = 0; i < originalArray.length; i++) { clonedArray.push(originalArray[i]); } console.log(clonedArray);> Wyjście
[ 1, 2, 3 ]>
Korzystanie z metody Array.map().
Używając Tablica.map() metoda to kolejny sposób klonowania tablicy w JavaScript. Ta metoda tworzy nową tablicę, mapując każdy element oryginalnej tablicy na nową wartość.
Przykład: Ten przykład pokazuje implementację opisanego powyżej podejścia.
binarny do bcdJavaScript
const originalArray = [1, 2, 3]; const clonedArray = originalArray.map(x =>X); konsola.log(clonedArray);>
Wyjście
[ 1, 2, 3 ]>
Użycie metody Array.from() z funkcją mapową
Używając Tablica.z() metoda z funkcją mapy to kolejny sposób klonowania tablicy w JavaScript. Ta metoda tworzy nową tablicę, mapując każdy element oryginalnej tablicy na nową wartość przy użyciu dostarczonej funkcji.
Przykład: Ten przykład pokazuje implementację opisanego powyżej podejścia.
JavaScript const originalArray = [1, 2, 3]; const clonedArray = Array.from(originalArray, x =>X); konsola.log(clonedArray);>
Wyjście
[ 1, 2, 3 ]>
Korzystanie z metody Array.of().
Ta metoda tworzy nową tablicę z tymi samymi elementami, co tablica oryginalna.
Przykład: Ten przykład pokazuje implementację opisanego powyżej podejścia.
JavaScript const originalArray = [1, 2, 3]; const clonedArray = Array.of(...originalArray); console.log(clonedArray);>
Wyjście
[ 1, 2, 3 ]>
Korzystanie z metod JSON.parse() i JSON.stringify().
Używając JSON.parse() I JSON.stringify() metody to kolejny sposób klonowania tablicy w JavaScript. Ta metoda polega na konwersji oryginalnej tablicy na ciąg JSON, a następnie przeanalizowaniu ciągu JSON w celu utworzenia nowej tablicy.
Przykład: Przykład ten pokazuje implementację opisanego powyżej podejścia.
to jestJavaScript
const originalArray = [1, 2, 3]; const clonedArray = JSON.parse(JSON.stringify(originalArray)); console.log(clonedArray);>
Wyjście
[ 1, 2, 3 ]>
Korzystanie z metody Object.sign().
Używając Obiekt.przypisz() metoda to kolejny sposób klonowania tablicy w JavaScript. Ta metoda tworzy nową tablicę, kopiując właściwości oryginalnej tablicy do nowego obiektu.
Przykład: Przykład ten pokazuje implementację opisanego powyżej podejścia.
JavaScript const originalArray = [1, 2, 3]; const clonedArray = Object.assign([], originalArray); console.log(clonedArray);>
Wyjście
[ 1, 2, 3 ]>
Korzystanie z metody Array.reduce().
The Metoda Array.reduce(). wykonuje funkcję redukującą na każdym elemencie tablicy, co daje pojedynczą wartość wyjściową. Możemy go użyć do skonstruowania nowej tablicy z tymi samymi elementami, co tablica oryginalna.
Składnia:
array.reduce((accumulator, currentValue, currentIndex, array) =>{ ... }, wartość początkowa);>Przykład : W tym przykładzie użyjemy metody Array.reduce() do utworzenia klonu tablicy.
JavaScript // Input array const originalArray = [1, 2, 3, 4]; // Cloning the array using reduce const clonedArray = originalArray.reduce((acc, val) =>{ acc.push(val); powrót wg; }, []); // Wyświetl oryginalne i sklonowane tablice console.log('Oryginalna tablica:', oryginalna tablica); // Dane wyjściowe: [1, 2, 3, 4] console.log('Sklonowana tablica:', clonedArray); // Dane wyjściowe: [1, 2, 3, 4]> Wyjście
Original Array: [ 1, 2, 3, 4 ] Cloned Array: [ 1, 2, 3, 4 ]>
Notatka: Dlatego też podczas klonowania tablicy należy wziąć pod uwagę złożoność danych i wymagania wydajnościowe aplikacji.