.slice() 대 .splice()

누구나 한 번쯤은 찾아봐야 할 것이 있습니다. JavaScript의 경우 슬라이스를 사용할 때와 배열에서 splice를 사용할 때가 발생합니다. 이 게시물을 작성하는 것은 (아마도) 그것을 끝내야 합니다.

혼란은 매우 유사하지만 동시에 매우 대조적인 방식으로 수행하므로 사용 사례가 다르기 때문에 발생합니다. 둘 다 배열의 섹션을 잡는 데 사용됩니다. 나는 둘 다 사용하는 방법을 분석하고 어느 것이 다른 것보다 적절할 때 내 생각을 말할 것입니다.

.일부분()

따라서 슬라이스는 배열의 섹션을 잡는 데 사용되며 원래 배열은 그대로 두고 해당 섹션의 새 COPY를 반환합니다. 이 메서드는 하나 또는 두 개의 매개변수를 사용할 수 있습니다.

첫 번째 매개변수는 시작하려는 배열의 인덱스입니다. 시작 인덱스는 새로 복사된 배열에 포함됩니다.

두 번째 매개변수는 중지하려는 인덱스입니다. 그러나 포함되지 않으므로 이 색인은 사본에 포함되지 않습니다.

두 번째 매개변수를 사용하지 않고 끝 인덱스를 지정하면 복사된 배열이 첫 번째 매개변수에서 시작하여 배열의 끝까지 계속됩니다.

예시:

const planets = ['Tatooine', 'Alderaan', 'Coruscant', 'Kashyyyk', 'Naboo', 'Hoth'];

// This will return indexes 1-4

const middleFourPlanets = planets.slice(1,5); 
console.log(middleFourPlanets);
//expected output: ['Alderaan', 'Coruscant', 'Kashyyyk', 'Naboo']

// This will return everything from index 3 on

const lastThreePlanets = planets.slice(3);
console.log(lastThreePlanets);
//expected output: ['Kashyyyk', 'Naboo', 'Hoth']

//The original array is still intact with all of its indexes;

console.log(planets);
//expected output: ['Tatooine', 'Alderaan', 'Coruscant', 'Kashyyyk', 'Naboo', 'Hoth']

따라서 .slice()의 사용 사례는 배열의 일부를 가져와야 하지만 여전히 원래 배열 전체가 필요한 경우입니다.

.접착()

splice 방법은 배열의 섹션을 잡는 데에도 사용되며 주요 차이점은 파괴적으로 수행한다는 것입니다. 배열의 일부를 꺼낼 수 있다는 사실 외에도 배열에 섹션을 추가/교체할 수도 있습니다. 세 가지 다른 유형의 매개변수를 사용합니다.

첫 번째 매개변수는 연결을 시작하려는 인덱스입니다. 이 인덱스가 포함되어 있습니다.

두 번째는 슬라이스와 다릅니다. 분할하려는 인덱스가 아니라 배열에서 분할하려는 항목의 수입니다. 이것이 선언되지 않으면 표시된 첫 번째 매개변수에서 배열이 잘립니다. 여기서 주목할 가치가 있는 것은 배열에 삽입하려는 경우 0을 지정할 수 있으며 항목을 제거하지 않는다는 것입니다.

세 번째 매개변수 유형은 제거된 위치 또는 지정된 위치에 삽입하려는 항목입니다. 세 번째 매개변수의 모든 항목이 삽입됩니다.

이것은 파괴적이기 때문에 원래 배열을 변경하므로 사용하기 전에 염두에 두십시오.

예시:

const planets = ['Tatooine', 'Alderaan', 'Coruscant', 'Kashyyyk', 'Naboo', 'Hoth'];

//This will start at index 2, remove 0 items, but insert two more strings at that position.

planets.splice(2, 0, 'Mustafar', 'Bespin');
console.log(planets);
// expected output: ['Tatooine', 'Alderaan', 'Coruscant', 'Mustafar', 'Bespin', 'Kashyyyk', 'Naboo', 'Hoth']

//This will start at index 0 and remove 1 item. 

planets.splice(0,1);
console.log(planets)
// expected output:  ['Alderaan', 'Coruscant', 'Mustafar', 'Bespin', 'Kashyyyk', 'Naboo', 'Hoth']


//This will remove all items after the indicated position

planets.splice(3);
console.log(planets);
// expected output: ['Alderaan', 'Coruscant', 'Mustafar']

따라서 특정 위치의 배열에 항목을 추가하는 데 효과적입니다. 관련이 없을 수 있는 배열의 세그먼트를 제거하는 것도 유용합니다.

나중에 원래 배열이 필요한 경우에는 사용하지 않아야 합니다.

마무리

나는 두 가지 중에서 조금 나아진 것 같으며 앞으로 어느 것을 사용해야 할지, 언제 사용해야 할지 알게 될 것이라고 생각합니다.

이 게시물은 주로 이 두 가지의 차이점을 확고히 하기 위한 것이지만, 이 게시물을 읽으셨다면 여러분도 무언가를 얻으셨기를 바랍니다. 언제나처럼.. 해피코딩!