Array slice와 splice 차이점

손종일·2020년 7월 27일
0

HTML/CSS

목록 보기
7/8
post-thumbnail

var arr = [1,2,3,4,5,6]

slice(start[, end])

--> 시작부터 끝까지 복사본을 새로운 배열의 객체로 반환한다. (원본 배열이 수정 X)

start

  • 배열의 길이보다 작을때 : 해당 index부터 끝까지 slice

    arr.slice(3) //[4, 5, 6]
    arr.slice(1,3) //[2, 3]

  • 배열의 길이보다 크거나 같을때 : 빈 배열을 반환

    arr.slice(6) //[]

  • 음수일때 : 배열의 끝에서 -n번째부터 끝까지 slice

    arr.slice(-3) //[4, 5, 6]

  • undefine : 해당 배열 전체가 slice

    arr.slice() //[1, 2, 3, 4, 5, 6]

end

  • 배열의 길이보다 작을때 : start부터 해당 index -1까지

    arr.slice(1,3) //[2, 3]

  • 음수일때 : start부터 뒤에서 -n번째까지 slice

    arr.slice(1,-1) // [2, 3, 4, 5]

  • undefined : 끝까지 slice

    arr.slice(-3) //[4, 5, 6]

모든 메소드를 사용하여도 원본 배열에 영향을 끼치지 않는다.

arr = [1, 2, 3, 4, 5, 6]

splice(start[, deleteCount[, num1[, num2[, ...]]]])

--> 배열의 기존 요소를 삭제, 교체, 추가하여 배열의 내용을 변경한다. (원본 배열이 수정 O)

메소드를 사용할때 마다 arr을 [1,2,3,4,5,6]으로 초기화 시켜줘야한다.

start

  • 배열의 길이보다 작을때 : 해당 index부터 끝까지 삭제

    arr.splice(3) //[4, 5, 6]
    arr//[1, 2, 3]
    arr.splice(1,3) //[2, 3, 4]
    arr //[1, 5, 6]

  • 배열의 길이보다 크거나 같을때 : 삭제하지 않는다. (기존 배열을 수정하지 않는다.)

    arr.splice(6) //[]
    arr //[1, 2, 3, 4, 5, 6]

  • 음수일때 : 배열의 끝에서 -n번째부터 끝까지 삭제한다.

    arr.splice(-3) //[4, 5, 6]
    arr //[1, 2, 3]

  • undefine : 삭제하지 않는다. (기존 배열을 수정하지 않는다.)

    arr.splice() //[]
    arr //[1, 2, 3, 4, 5, 6]

deleteCount (배열의 요소 삭제)

  • undefined거나 해당 배열의 길이보다 크고, start보다 클경우 :start 뒤의 모든 요소를 삭제

    arr.splice(3) //[4, 5, 6]
    arr//[1, 2, 3]
    arr.splice(1,3) //[2, 3, 4]
    arr //[1, 5, 6]

  • 0 or 음수 : 어떤 요소도 제거하지 않는다.

    arr.splice(1,-1) //[]
    arr //[1, 2, 3, 4, 5, 6]

num n... (배열의 요소 추가)

  • undefined : 추가하지 않는다.
  • 요소를 지정할 때 배열에 추가한다.

    arr.splice(3,5,'a','b','c') //[3, 5, 'a', 'b', 'c']
    arr//[1, 2, 3, 'a', 'b', 'c']

profile
Allday

0개의 댓글