JS array push, unshift, pop, shift method implementation

Guide for JavaScript array push, unshift, pop, shift method implementation
This article mainly introduces the JS array push, unshift, pop, shift methods, combined with the example form to analyze the JS array push, unshift, pop, shift methods for array addition, deletion, and other related operation skills.

This article describes the implementation and use of JS array push, unshift, pop, shift methods. Share with you for your reference, as follows:

Push at the end (push)

The push () method adds one or more elements to the end of the array and returns the new length of the array.

It can be seen from the explanation that the push method only needs to put the elements to be added to the end of the array in sequence, and will not change the index of the original array elements. So loop through the parameter list and put the new elements at the end of the array in order.
Array.prototype._push = function (...value) {
  for (var i = 0; i < arguments.length; i++) {
    this[this.length] = arguments[i];
  }
  return this.length;
};

var arr = [1, 2, 3, 4];
arr._push(9, 8);
console.log(arr); // [ 1, 2, 3, 4, 9, 8 ]

Header addition (unshift)

The unshift () method adds one or more elements to the beginning of the array and returns the new length of the array (this method modifies the original array).

Add elements to the head of the array, the length of the array will also change, but unlike the operation of adding the tail, the original element index of the array does not change. To add the head, you need to move the index of the original element to the right.

For example, to add only one bit, you need to shift the index of each element of the array to the right one by one. Assuming that the original array length is 4, add an element to the head, and the length becomes 5.
So now it becomes, array.length = 5 and the current array[5 - 1] is the last element, now because it moves backward in sequence, it array[5] must be the last element
So we can loop from the last bit of the array to the next bit, array[i] assign the value to the loop, array[i - 1] stop at 1, and assign the 0th item of the array to the value that needs to be added.

The process is as follows.
Specific code implementation:
Array.prototype._unshift = function (value) {
  for (let i = this.length; i > 0; i--) {
    this[i] = this[i - 1];
  }
  this[0] = value;
  return this.length;
};
var arr = [1, 2, 3, 4];
arr._unshift(8);
console.log(arr); // [ 8, 1, 2, 3, 4 ]
But the above code only implements the addition of an element's head, and the unshift method supports adding multiple elements. E.g:
var arr = [1, 2, 3, 4];
arr.unshift(8, 7);
console.log(arr); // [ 8, 7, 1, 2, 3, 4 ]
For such a situation, you need to know that several parameters have been passed in. You can start with the arguments object. The idea is the above idea: the first loop based on the length of the last generated array from the back to the front, move the elements in the sequence, and then sequentially place the new elements put at the head of the array.

The length of the new array is equal to the length of the original array plus the number of parameters, looping from back to front to move the last bit of the original array to the last bit of the new array, Because it is necessary to insert elements with the number of input parameters in the head, the starting point of the loop is the length of the original array plus the number of parameters, and the endpoint of the loop is the number of input parameters.

But since the index is always one bit less than the length, the start and endpoints need to be decremented by 1. Now you can write the logic of circular movement first.
Array.prototype._unshift = function (...value) {
  for (var i = this.length + arguments.length - 1; i > arguments.length - 1; i--) {
    this[i] = this[i - arguments.length];
  }
};
Think again, because the previous step has been moved, the position of the array head has been vacated, the second step is to insert a few elements with several parameters. So now you only need to insert in a loop:
for(var k = 0; k < arguments.length; k++) {
  this[k] = arguments[k];
}
The complete code is as follows:
Array.prototype._unshift = function (...value) {
  for (var i = this.length + arguments.length - 1; i > arguments.length - 1; i--) {
    this[i] = this[i - arguments.length];
  }
  for (var k = 0; k < arguments.length; k++) {
    this[k] = arguments[k];
  }
  return this.length;
};
var arr = [1, 2, 3, 4];
arr._unshift(9, 8);
console.log(arr); // [ 9, 8, 1, 2, 3, 4 ]

Tail deletion (pop)

The pop () method will delete the last element of the array object, reduce the length of the array by 1, and return the value of the element is deleted. If the array is already empty, pop () does not change the array and returns an undefined value.

This is very easy to achieve, you can do it step by step according to the definition. First, record the last element to facilitate the return, then delete the last element from the array, point it to null and release, then reduce the length of the array by 1, and finally judge whether it is an empty array.
Array.prototype._pop = function () {
  if (!this.length) {
    return undefined;
  }
  var end = this[this.length - 1];
  this[this.length - 1] = null;
  this.length = this.length - 1;
  return end;
};
var arr = [1, 2, 3, 4];
arr._pop();
console.log(arr); // [ 1, 2, 3 ]

Head shift (shift)

The shift () method is used to delete the first element of the array and return the value of the first element.

Header deletion will change the index of the original array element, that is, the index of the element that has not been deleted is shifted to the left. First, the deleted element must be recorded for easy return, and then the first element of the array is pointed to null, Finally loop through the array and move the index.
Array.prototype._shift = function () {
  if (!this.length) {
    return undefined;
  }
  var start = this[0];
  this[0] = null;
  for (var i = 0; i < this.length - 1; i++) {
    this[i] = this[i + 1];
  }
  this.length = this.length - 1;
  return start;
};
var arr = [1, 2, 3, 4];
arr._shift();
console.log(arr); // [ 2, 3, 4 ]