Home > Web Front-end > JS Tutorial > How to remove elements from an array until the passed function returns true in JavaScript?

How to remove elements from an array until the passed function returns true in JavaScript?

PHPz
Release: 2023-08-24 16:37:02
forward
809 people have browsed it

如何从数组中删除元素,直到传递的函数在 JavaScript 中返回 true?

In JavaScript, there are various ways to remove elements from an array until the passed function returns true. In this tutorial we will go over 3 methods in detail.

Using Array.prototype.filter()

The Array.prototype.filter() method can be used to remove elements from an array until the passed function returns true. See the Array filter() method for more details.

Example 1

The following code shows how to use this method -

<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>
Copy after login

As you can see, we have created an array containing numbers from 1 to 10. Then use the filter() method to remove all elements less than 5. Finally, we show the new array with the deleted elements.

Using a for loop

Another way to remove elements from an array until the passed function returns true is to use a for loop.

< h2>Example 2

The following code shows how to use this method -

<!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>
Copy after login

As you can see, we have again created a array. We then use a for loop to iterate over each element in the array. If the current element is less than 5, we add it to the new array. Otherwise, we are out of the loop. Finally, we display the new array.

Using Array.prototype.slice()

Another way to remove elements from an array until the passed function returns true is to use the Array .prototype.slice() method. Please refer to the array slicing method for details.

Example 3

The following code shows how to use this method -

<!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>
Copy after login

As you can see, we have again created a array. We then use the slice() method to extract the first 5 elements from the array. Finally, we display the new array.

The above is the detailed content of How to remove elements from an array until the passed function returns true in JavaScript?. For more information, please follow other related articles on the PHP Chinese website!

source:tutorialspoint.com
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template