JavaScript

slice 메서드

한우종 2024. 7. 30. 18:56
slice

 

 

  • slice 란?
배열이나 문자열의 일부를 추출하여 새로운 배열이나 문자열을 생성하는데 사용된다.
이 메서드는 원본 배열이나 문자열을 수정하지않고 지정된 범위의 요소나 문자를 포함하는
새로운 객체를 반환한다.

  • 기본구조
array.slice(begin,end)

 

  • 매개변수
  • begin
    추출을 시작할 인덱스(포함). 이 값이 음수인 경우 배열의 끝에서 부터 계산한다.
  • end
    추출을 종료할 인덱스(미포함). 이 값도 음수 일 수 있다.
    이 매개변수를 생략하면 배열의 끝까지 추출된다.

  • 예시
  • 양수인 경우
const arr = [1,2,3,4,5]
const sliceNum = arr.slice(1,4)
console.log(sliceNum) // 출력: 2,3,4
//1,2,3,4,5 === 0,1,2,3,4 와 같다
//begin = 1 , end = 4  로 지정할 경우 1(포함)4(미포함) 함으로 1,2,3 에 해당하는 값만 반환한다.
  • 음수인 경우
const arr = [1,2,3,4,5]
const sliceNum = arr.slice(-2)
console.log(sliceNum) // 출력:4,5 
//begin 값을 음수로 줌으로서 배열의 끝 에서 부터 계산 1,2,3,4,5 === -5,-4,-3,-2,-1 과 같으며
// begin = -2 를 주고 end 값을 설정하지 않았으므로 배열의 끝 -1 까지 반환한다.

 

  • 문자열의 slice 사용법
  • 기본구조
string.slice(beginIndex,endIndex)

 

  • 매개변수
  • beginIndex
    추출을 시작할 인덱스(포함) //위 와 동일
  • endIndex
    추출을 종료할 인덱스(미포함)//위 와 동일

  • 예시
  • 양수인 경우
const text = "안녕하세요!"
const sliceText = text.slice(1,3)
console.log(sliceText) // 출력:'녕하'
//안 = 0 , 녕 = 1 , 하 = 2, 세 = 3 , 요 = 4 , ! = 5 로 볼수 있으며
// beginIndex = 1 , endIndex = 3 을 줬으므로 1,2 의 값 까지만 반환한다.

 

  • 음수인 경우
const text = "안녕하세요!"
const sliceText = text.slice(-2)
console.log(sliceText) // 출력: '요!'
//beginIndex = -2 의 음수를 줌으로 배열의 끝에서 부터 게산한다.
//endIndex 값을 주지않았기 때문에 배열의 끝까지 추출된다.
// 안= -6,녕= -5,하= -4,세= -3,요= -2,!= -1 의 값으로 볼수 있으며 -2 부터 -1 까지인 요! 까지 추출된다.