jquery 중지 루프 기능

jQuery를 사용하여 JavaScript 프로그램을 작성할 때 루프 함수는 종종 배열이나 객체를 순회하는 데 사용됩니다. 하지만 특정 조건이 충족되어 루프를 종료해야 하는 경우와 같이 루프 기능의 실행을 중지해야 하는 경우도 있습니다. 그렇다면 루프 기능의 실행을 중지하는 방법은 무엇입니까? 이 기사에서는 몇 가지 방법을 소개합니다.

1. break 문을 사용하세요

JavaScript의 break 문을 사용하여 루프를 벗어날 수 있습니다. jQuery의 Each() 함수를 사용할 때 루프 본문에 break 문을 사용하여 루프를 종료할 수 있습니다. 예:

$.each([1, 2, 3, 4, 5], function(index, value) {
  console.log(value);
  if (value === 3) {
    return false; // 等效于 break
  }
});

이 예에서 $.each() 메서드는 배열을 순회하고 각 요소의 값을 출력합니다. 요소의 값이 3과 같을 때 break 문의 역할이 시작됩니다. 이 시점에서 루프가 종료되고 출력 결과는 다음과 같습니다.

1
2
3

여기서 return false 및 break 문은 동일한 효과를 갖습니다. 왜냐하면 각각() 함수 내에서 함수가 false를 반환하면 다음과 동일하기 때문입니다. break 문을 사용하여 루프에서 빠져나옵니다.

2. 변수 마커 사용

경우에 따라 루프를 종료하기 위해 break 문을 직접 사용하는 것이 불가능할 수 있습니다. 이 경우 이를 달성하기 위해 변수 마커를 사용할 수 있습니다. 예:

var stopped = false;
$.each([1,2,3,4,5], function(index, value){
  console.log(value);
  if(value == 3) {
    stopped = true;
    return false;
  }
});

if(stopped) {
  console.log('循环被停止了！');
}

여기에서는 stopped라는 변수를 사용하고 3으로 반복되면 true로 설정합니다. 그런 다음 루프 후에 변수가 판단됩니다. true이면 루프가 중지되었음을 의미합니다. 하지만 매번 마커 변수를 사용해야 한다면 코드의 가독성이 떨어질 수 있음과 동시에 변수 이름 지정에도 주의가 필요하다는 점에 유의해야 합니다.

3. $.each()의 두 번째 매개변수를 사용하세요

두 개의 매개변수(첫 번째 매개변수는 순회된 객체이고 두 번째 매개변수는 콜백 함수)를 허용하는 것 외에도 $.each() 함수에는 세 번째 매개변수입니다. 루프를 중단할지 여부를 나타내는 세 가지 선택적 매개변수입니다. 세 번째 매개변수가 true이면 루프가 중단되고, False이면 루프가 계속됩니다.

예:

$.each([1,2,3,4,5], function(index, value){
  console.log(value);
  if(value == 3) {
    return false;
  }
}, true);

반환된 결과는 다음과 같습니다.

1
2
3

세 번째 매개변수가 true인 경우 세 번째 매개변수의 값이 루프 개체로 작동한다는 점에 주목할 필요가 있습니다. 따라서 다음과 같이 작성할 수도 있습니다:

$.each([1,2,3,4,5], function(index, value, stop){
  console.log(value);
  if(value == 3) {
    stop();
  }
}, true);

이것의 장점은 return false 문 대신 stop() 함수 이름을 사용하여 코드 가독성을 향상시킬 수 있다는 것입니다. 동시에 stop() 함수에 종료 루프 코드를 유연하게 작성할 수도 있습니다.

4. 다른 루핑 방법 사용

map(), grep(), inArray() 등과 같은 다른 jQuery 루핑 함수에는 모두 루프를 중단하는 기능이 있습니다. 예:

var arr = [1,2,3,4,5];
$.map(arr, function(val, i){
  console.log(val);
  if(val == 3) {
    return null;
  }
});

이 예에서는 map() 메서드를 사용합니다. map() 메소드는 arr 배열의 각 요소에 대해 콜백 함수를 한 번씩 실행합니다. 배열의 요소 값이 3과 같으면 null 값을 반환하며, 이는 map() 메서드의 출력 목록에서 값 3을 생략합니다. 출력 결과는 다음과 같습니다.

1
2
4
5

또한 jQuery의 grep() 함수를 사용하여 배열 필터링 작업을 구현할 수도 있습니다.

요약:

위는 루프 기능을 중지하는 여러 가지 방법입니다. 실제 상황에 따라 다른 방법을 선택하세요. 그중에서도 break 문과 변수 마커를 사용하는 것이 더 일반적이고 비교적 간단하고 이해하기 쉽습니다. 또한, 짧고 간결한 코드의 사용을 맹목적으로 추구하지 않는 것이 가장 중요합니다.

위 내용은 jquery 중지 루프 기능의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!