Javascript 치트 시트: .slice() 및 .splice()

나는 최근에 사용자가 js 메소드 .slice()와 .splice() 사이의 차이점을 인터넷 검색 없이 알고 있다면 사용자가 다른 사람들에게 도전하는 트위터 게시물을 발견했습니다. 많은 사람들이 그것들을 섞었습니다.

그래서 두 가지 방법에 대해 알아야 할 모든 정보를 간단하게 정리한 요약본을 만들었습니다.

알아야 할 사항

.slice() 및 splice()는 모두 배열 메서드입니다.

둘 다 배열을 출력으로 반환합니다

.

핵심은 그들이 출력 배열로 반환하는 것과 원래 배열을 변경하는지(이 적용된 배열)에 주의를 기울이는 것입니다.

1) .슬라이스()

.slice()는 배열에서 선택한 요소를 새 배열로 반환합니다. 선택은 인덱스로 수행됩니다.

.slice()가 원래 배열에 영향을 주지 않음

splice()를 사용하면 하나 이상의 요소를 선택할 수 있습니다.

예: 이 코드 스니펫은 3(인덱스 2에 있음)을 반환합니다.

[1,2,3,4,5].slice(2) // returns 3 (which is at index 2)

이 코드 스니펫은 2,3,4를 반환합니다(인덱스 1에서 4까지만).

[1,2,3,4,5].slice(1,4) // returns 2,3,4 (from index 1 to 4 exclusively)

2) .스플라이스()

.splice는 원래 배열을 수정합니다(배열에서 요소를 추가 및/또는 제거)

.

메서드가 **수정된** 원본 배열을 반환합니다.

스플라이스를 사용하면 다음을 수행할 수 있습니다.

요소 제거

[1,2,3,4,5].splice(3) // returns [1,2,3] (first 3 elements)
[1,2,3,4,5].splice(2,2) // at position 2 remove 2 elements (returns [1,2,5])

요소 추가

[1,2,5].splice(2,0,3,4) // at postion 2 add 2 elements (returns [1,2,3,4,5])

동시에 요소 제거 및 추가

// at position 2, remove 1 elements and add 2 new items
[1,2,3,4,5].splice(2,2,"HTML","CSS") // returns [1,2,"HTML","CSS",5]

기억하세요: .splice()는 배열을 변경하지만 .slice()는 변경하지 않습니다!

이것이 누군가에게 도움이 되길 바랍니다 💜