본문 바로가기
개발/jQuery

jQuery (제이쿼리) - jQuery slice()

by 루 프란체 2018. 6. 24.

사실 어디에 쓰는건지 아직 잘 모르겠는데 하여튼 제이쿼리에는 slice() 라는 함수도 있다.


그리고 영어에는 slice of cake 라는 말도 있는데 예전에 모 대리님한테 slice of cake 라는 말을 사용 했다가

slice 가 아니고 piece 라고 매우 갈굼 먹은 다음에 구글링을 해보니 slice of cake 도 맞는 말이라고 해서

맞잖아요!!! 빼애애애애애액!!! 했더니 마지못해 인정하던 기억도 난다.


하여튼 방금 쓰잘데기 없는 사족을 달은 이유는 이 slice 라는 함수를 좀 더 이해하기 쉽게 하기 위해서인데

이 slice 라는 함수는 여러 개의 객체 중 일정 부분을 선택할 수 있게 해주는 범위 함수이기 때문이다.


기본적인 사용 문법은 다음과 같다.

$(document).ready(function() {
	$("p").slice(1, 3).css("background-color", "red");
});

1. A-C

2. D-G

3. H-L

4. M-P

5. Q-S

위의 스크립트를 실행하면 2. D-G 와 3. H-L 의 배경색이 빨갛게 바뀌는 것을 확인 할 수 있다.


파라미터로 줄 수 있는 인덱스는 다른 함수들과 마찬가지로 0 에서부터 시작하며 파라미터의 두 범위를 

각각 A, B 라고 하고 선택되는 범위를 X 라 했을 때 slice() 함수로 선택되는 범위는 A <= X < B 이다. 

즉, 위의 예제에서는 2. D-G (인덱스 넘버 1) 그리고 3. H-L (인덱스 넘버 2) 이 해당된다.


또한 파라미터는 하나만 사용할 수도 있는데 그 경우 선택되는 범위는 A <= X 이다.

A 인덱스와 같거나 크면 전부 선택된다는 것이다.


또한 이 함수를 사용할 때는 주의점이 있는데 위에도 말했지만 이 함수는 slice of cake 이고

범위를 선택할 수 있는 함수이기 때문에 1, 3, 5 이런 식으로 서로 떨어진 범위를 선택하는 것은 불가능하다.

댓글