JavaScript에서 전달된 함수가 true를 반환할 때까지 배열에서 요소를 제거하는 방법은 무엇입니까?
- PHPz앞으로
- 2023-08-24 16:37:02811검색
JavaScript에는 전달된 함수가 true를 반환할 때까지 배열에서 요소를 제거하는 여러 가지 방법이 있습니다. 이 튜토리얼에서는 3가지 방법을 자세히 살펴보겠습니다.
Array.prototype.filter() 사용
Array.prototype.filter() 메서드를 사용하면 전달된 함수가 true를 반환할 때까지 배열에서 요소를 제거할 수 있습니다. 자세한 내용은 배열 filter() 메서드를 참조하세요.
예제 1
다음 코드는 이 메서드를 사용하는 방법을 보여줍니다. -
<html>
<head>
<title>Examples</title>
</head>
<body>
<div id="array"></div>
<div id="result"></div>
<script>
var arr = [1,2,3,4,5,6,7,8,9,10];
function remove(item) {
return item < 5;
}
var newArr = arr.filter(remove);
document.getElementById("array").innerHTML = "Array: " + arr;
document.getElementById("result").innerHTML = "Removed Elements: " + newArr;
</script>
</body>
</html>보시다시피 1부터 10까지의 숫자가 포함된 배열을 만들었습니다. 그런 다음 filter() 메서드를 사용하여 5보다 작은 모든 요소를 제거합니다. 마지막으로 삭제된 요소가 포함된 새 배열을 표시합니다.
for 루프 사용
전달된 함수가 true를 반환할 때까지 배열에서 요소를 제거하는 또 다른 방법은 for 루프를 사용하는 것입니다.
예제 2다음 코드는 이 메서드를 사용하는 방법을 보여줍니다. -
<!doctype html>
<html>
<head>
<title>Examples</title>
</head>
<body>
<div id="result"></div>
<script>
var arr = [1,2,3,4,5,6,7,8,9,10];
var newArr = [];
for(var i=0; i < arr.length; i++) {
if(arr[i] < 5) {
newArr.push(arr[i]);
} else {
break;
}
}
document.getElementById("result").innerHTML = newArr
</script>
</body>
</html>보시다시피 1부터 10까지의 숫자가 포함된 배열을 다시 생성했습니다. 그런 다음 for 루프를 사용하여 배열의 각 요소를 반복합니다. 현재 요소가 5보다 작으면 새 배열에 추가합니다. 그렇지 않으면 우리는 루프에서 벗어납니다. 마지막으로 새 배열을 표시합니다.
Array.prototype.slice() 사용
전달된 함수가 true를 반환할 때까지 배열에서 요소를 제거하는 또 다른 방법은 Array .prototype.slice() 메서드를 사용하는 것입니다. 자세한 내용은 어레이 슬라이싱 방법을 참고하세요.
예제 3
다음 코드는 이 메서드를 사용하는 방법을 보여줍니다. -
<!doctype html>
<html>
<head>
<title>Examples</title>
</head>
<body>
<div id="result"></div>
<script>
var arr = [1,2,3,4,5,6,7,8,9,10];
var newArr = arr.slice(0,5);
document.getElementById("result").innerHTML = newArr
</script>
</body>
</html>보시다시피 1부터 10까지의 숫자가 포함된 배열을 다시 생성했습니다. 그런 다음 slice() 메서드를 사용하여 배열에서 처음 5개 요소를 추출합니다. 마지막으로 새 배열을 표시합니다.
위 내용은 JavaScript에서 전달된 함수가 true를 반환할 때까지 배열에서 요소를 제거하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!