How to Remove the First and Last Element in Array in JavaScript

To remove the first, specific, and last element from the array in js; in this tutorial, we will show you 4 approaches on how to remove the first, specific, and last element or item from an array in javascript.

If you want to remove elements from the end of an array, from the beginning, from the middle, or the specific index. So you can use the below-given approaches to remove elements from JavaScript arrays.

How to Remove the First and Last Element in Array in JavaScript

Here are 4 approaches to removing the first, specific, and last element from an array in Javascript:

  1. Approach 1: Remove the last element from the array of javascript using Pop()
  2. Approach 2: Remove the first element from the array of javascript using shift()
  3. Approach 3: Remove specific elements from array javascript using Splice ()
  4. Approach 4: Remove First and Last Element Array Using filter() method
  5. Approach 5: To Remove Specific JSON Object From Array Javascript

Approach 1: Remove the last element from the array of javascript using Pop()

The pop() method helps us to remove or delete the last element from the array and return it. It removes the last element and changes the original array.

Here is an example function of removing the last element from the array javascript using pop:

 var arr = [ "one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten" ];

 arr.pop();

 console.log( arr );

Result of the above example

["one", "two", "three", "four", "five", "six", "seven", "eight", "nine"]
 

Approach 2: Remove the first element from the array of javascript using shift()

The shift() method helps us to remove or delete first element from the array. It removes the first element and shifts all remaining elements one position down.

Here is an example of removing first element from the array javascript using shift:

  var arr = [ "one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten" ];

 arr.shift();

 console.log( arr );
 

The shift method removed only the first array element. When the element is removed the remaining elements are shifted down.

The result of the above example

 ["two", "three", "four", "five", "six", "seven", "eight", "nine", "ten"]
 

Approach 3: Remove specific elements from array javascript using Splice ()

You can find the index of the element you want to remove using indexOf() and then remove it with splice() method.

For example, to remove the item ‘cherry’ from the array, you can use the following code:”

const array = ['apple', 'banana', 'cherry', 'date'];
const indexToRemove = 2;

array.splice(indexToRemove, 1);

console.log(array); // Output: ['apple', 'banana', 'date']

Result of the above example

// Output: ['apple', 'banana', 'date']

Approach 4: Remove First and Last Element Array Using filter() method

The array filter() method helps us to create a new array that contains only the elements that fulfill a given or certain condition. To remove the first or last element, you can use the filter() method with like following example:

var arr = [1, 2, 3, 4, 5];
var newArr = arr.filter(function(element, index) {
  return index !== 0 && index !== arr.length - 1;
});
console.log(newArr); // [2, 3, 4]

Result of the above example

// [2, 3, 4]

Approach 5: To Remove Specific JSON Object From Array Javascript

To remove particular JSON object from an array. First, need to find its index using indexOf(), and then use splice() by passing that index to remove the object.

Here is an example of how to remove a specific JSON object from an array using the splice() method:

var arr = [
 {id:1,name:'hello'},
 {id:2,name:'world'},
 {id:3,name:'cool'},
 {id:4,name:'javascript'},
 {id:5,name:'jquery'}
 ];
 var ind = arr.findIndex(function(element){
    return element.id===3;
 })
 if(ind!==-1){
 arr.splice(ind, 1)
 }
 console.log (arr);

Conclusion

In this tutorial, you have learned various javascript built-in methods to remove elements from arrays, remove a specific element from array javascript, remove first element from array javascript, remove last element from array javascript and remove object from json array javascript.

Recommended JavaScript Tutorials

AuthorDevendra Dode

Greetings, I'm Devendra Dode, a full-stack developer, entrepreneur, and the proud owner of Tutsmake.com. My passion lies in crafting informative tutorials and offering valuable tips to assist fellow developers on their coding journey. Within my content, I cover a spectrum of technologies, including PHP, Python, JavaScript, jQuery, Laravel, Livewire, CodeIgniter, Node.js, Express.js, Vue.js, Angular.js, React.js, MySQL, MongoDB, REST APIs, Windows, XAMPP, Linux, Ubuntu, Amazon AWS, Composer, SEO, WordPress, SSL, and Bootstrap. Whether you're starting out or looking for advanced examples, I provide step-by-step guides and practical demonstrations to make your learning experience seamless. Let's explore the diverse realms of coding together.

Leave a Reply

Your email address will not be published. Required fields are marked *