如何在 JavaScript 中移除数组中索引为 0 的元素并返回其余元素？

数组是一种结构，可以保存值元素，并且可以通过使用索引号引用它们来访问它们。

Const colors = [“Green”, “Maroon”, “Blue”];

数组的索引引用

在 JavaScript 中，数组通过索引引用来引用。这些索引是从零开始的。数组中的第一个元素将是索引 0。第二个元素将是索引 1。数组中的最后一个元素将是数组的总大小减 1。

扩展运算符 (…)

在本文中，我们将讨论如何在 JavaScript 中移除数组中索引为 0 的元素并返回其余元素。

使用 rest() 方法

_.rest() 方法位于 JavaScript 中的 underscore.js 库中。此方法将在数组上执行，返回除索引 0 以外的其余元素。

它包含两个参数，第一个是数组，另一个是索引值。第二个参数将从提到的索引数组开始搜索。

语法

_.rest( array, index );

示例 1

使用 rest 运算符

在这种情况下，我们对数组执行了 rest 方法以打印数组中第 0 个元素之后的元素。因为我们没有包含第二个参数。

<html>
<body>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
   </script>
   <script type="text/javascript">
      document.write("Resultant array after performing rest method");
      document.write(_.rest([1, "Sharukh", 3, "Hrithik", 5, 6, 7, 8, "Aamir", 10]));
   </script>
</body>
</html>

示例 2

在这种情况下，我们对数组执行了rest方法以打印第二个参数中传递的索引号之后的元素。这意味着它不会打印传递的索引号之前的元素。它打印该传递索引号之后的元素。

<html>
<body>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
   </script>
   <script type="text/javascript">
      document.write("Resultant array after performing rest method: ");
      document.write(_.rest([1, "Sharukh", 3, "Hrithik", 5, 6, 7, 8, "Aamir", 10],2));
   </script>
</body>
</html>

示例 3

使用 shift() 方法

在这种情况下，我们使用shift方法移除数组中索引为 0 的元素，并将其大小减少 1。

<!DOCTYPE html>
<html>
   <title>Removing element using Shift method</title>
<head>
   <script>
      /* JavaScript code to perform shift() method to remove elements from array */
      function remove() {
         var arr = ["Car", "Bus", "Flight", "Train", "Bike"];
         
         // Deleting the first element in the array
         document.write("Original Array: " +arr+ "<br>");
         
         //Performing the deletion
         var newArr = arr.shift();
         document.write("Removed element: " + newArr + "<br>");
         document.write("Remaining elements: " + arr);
      }
      remove();
   </script>
</head>
<body>
</body>
</html>

示例 4

使用 splice() 方法

在这种情况下，我们执行了splice方法来移除数组中的第一个元素。此方法通过添加或修改元素来修改现有数组。为了移除，我们需要指定特定元素。

<!DOCTYPE html>
<html>
   <title>Removing an element using Shift method</title>
<head>
   <script>
      // JavaScript code to perform splice() function on array
      function Array() {
         var arr = ["Lion", "Tiger", "Cheetah", "Elephant", "Giraffe"]; // creating an array
         document.write("Original Array: " +arr+"<br>");
         
         // performing the removal of particular element from the array
         var newArr = arr.splice(0, 1);
         document.write("Removed element: " + newArr + "<br>");
         document.write("Remaining elements: " + arr);
      }
      Array();
   </script>
</head>
<body>
</body>
</html>

示例 5

在 splice 方法中使用 for 循环

在这种情况下，我们通过在 splice 方法中添加 for 循环来移除数组中索引为 0 的元素。

<!DOCTYPE html>
<html>
   <title>Removing an element using Splice method</title>
<head>
   <script>
      // JavaScript code to perform splice() function on array.
      function Array() {
         var arr = ["BMW", "AUDI", "JAGUAR", "FERRARI", "LAMBHORGINI"];
         document.write("Original Array: " + arr + "<br>");
         // Removing the specified element by value from the array
         for (var i = 0; i < arr.length; i++) {
            if (arr[i] === "BMW") {
               var newArr = arr.splice(i, 1);
               document.write("Removed element: " + newArr + "<br>");
               document.write("Remaining elements: " + arr);
            }
         }
      }
      Array();
   </script>
</head>
<body>
</body>
</html>

示例 6

使用 remove() 方法

在这种情况下，通过使用 filter 方法创建 remove() 方法来移除第 0 个节点。

<!DOCTYPE html>
<html>
   <title>Removing an element in array using REMOVE NODE method</title>
<head>
   <script>
      // Declare an array
      var arr = ["Ten", "Twenty", "Thirty", "Fourty", "Fifty"]
      
      //Creating function
      function arrayRemove(array, value) {
         document.write("Original Array: " + arr + "<br>");
         // performing filter method to create a remove method
         return arr.filter(function(func) {
            return func != value;
         });
      }
      var result = arrayRemove(arr, "Ten");
      document.write("Remaining elements: " + result)
   </script>
</head>
<body>
</body>
</html>

示例 7

使用 Delete 运算符

在这种情况下，我们使用 Delete 运算符执行了数组中索引为 0 的元素的删除操作。

<!DOCTYPE html>
<html>
   <title>Removing an element in array using DELETE OPERATOR method</title>
<head>
   <script>
      // Create and assign elements to an array
      var arr = ["Ironman", "Batman", "Thor", "CapAmerica", "Groot"]
      document.write("The original array: " + arr +"<br>")
      
      // Delete element at index 0
      var deleted = delete arr[0];
      
      //Printing the rest of the array
      document.write("Remaining elements: " + arr);
   </script>
   </head>
<body>
</body>
</html>

示例 8

使用 for 循环遍历数组

在这种情况下，我们创建的 for 循环将遍历数组，排除已移除的元素，并将剩余元素存储到函数内部定义的新数组中。

<!DOCTYPE html>
<html>
   <title>Removing an element in array using for loop() and new array</title>
<head>
   <script>
      let deleteElement = (arr, n) => {
         let newArray = [];
         for (let i = 0; i < arr.length; i++) {
            if (arr[i] !== n) {
               newArray.push(arr[i]);
            }
         }
         return newArray;
      };
      
      //Elements in the array
      let elements_in_array = ["SHIFT", "ALT", "TAB", "CAPS", "HOME"];
      
      //Selecting the element to be deleted
      let element_to_be_deleted = "SHIFT";
      let newArr = deleteElement(elements_in_array, element_to_be_deleted);
      document.write("Existing array is: " + elements_in_array);
      document.write("Remaining elements after deletion: " + newArr);
   </script>
</head>
<body>
</body>
</html>

更新于： 2022-09-19

657 次浏览

启动您的 职业生涯

通过完成课程获得认证

开始学习
广告