Home >Web Front-end >JS Tutorial >Detailed graphic explanation of how to delete an element of an array in JavaScript

Detailed graphic explanation of how to delete an element of an array in JavaScript

yulia
yuliaOriginal
2018-10-10 11:41:3520574browse

JavaScript is often used in front-end development, so do you know how to use JS to delete specified elements with values? This article will share with you several methods of deleting an element of an array in JS. Friends who are interested can refer to it. I hope it can help you.

Method 1: slice() deletes array elements

The slice method can intercept a certain part of the array, and all major browsers support the slice method.

Syntax: array.slice(start, end)
start indicates the starting position of interception, end indicates the ending position, omitting end means intercepting to the last bit.

Example: Click the button to delete the first element of the array

Description: If we want to delete the first element of the array, we can use the slice method to intercept the first element. For elements other than slice(1), the code is as follows:

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
 </head>
 <body>  
  <p id="demo">点击按钮删除第一个数组元素。</p>
  <button onclick="myFunction()">点我</button>
 </body>
 <script type="text/javascript">
  function myFunction(){
   var animal = ["dog", "cat", "elephant", "tiger","rabbit"];
   var animal1= animal.slice(1);
   document.write("新数组是:"+ animal1)
  }
 </script>
</html>

Rendering:

Detailed graphic explanation of how to delete an element of an array in JavaScript

Method 2 :shift() Delete array elements

The shift method can delete the first element of the array and then return the value of the first element. All major browsers support the shift method. The disadvantage is that only the first element of the array can be deleted.
Syntax: array.shift()

The code is as follows:

<script type="text/javascript">
  function myFunction(){
   var animal = ["dog", "cat", "elephant", "tiger","rabbit"];
   var animal1= animal.shift();
   document.write("删除的元素是:"+ animal1)
  }
 </script>

Rendering:

Detailed graphic explanation of how to delete an element of an array in JavaScript

Method 3: splice() method to delete array elements

The splice() method can insert, delete or replace array elements, and all major browsers support splice method.

Syntax: array.splice(index,howmany,item1,...,itemX)
index indicates where to add or delete elements, howmany indicates how many elements should be deleted, item indicates to add to the new element of the array.

Example description: Delete an element starting from the subscript 0. The code is as follows:

<script type="text/javascript">
  function myFunction(){
   var animal = ["dog", "cat", "elephant", "tiger","rabbit"];
   var animal1= animal.splice(0,1);
   document.write("删除的元素是:"+ animal1)
  }
 </script>

Rendering:

Detailed graphic explanation of how to delete an element of an array in JavaScript

Above It introduces three methods in JavaScript to delete an element in an array. The principles are the same, but the methods are different. Which method to choose at work depends on work needs and personal habits. Newbies can try it themselves and deepen their understanding. I hope this This article can help you!

For more related tutorials, please visit JavaScript video tutorial php public welfare training

The above is the detailed content of Detailed graphic explanation of how to delete an element of an array in JavaScript. For more information, please follow other related articles on the PHP Chinese website!

Statement:
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