Implementation of the addition, deletion, modification, and query functions of JavaScript arrays

This article mainly introduces the simple implementation of adding, deleting, modifying and checking JS array operations. The editor thinks it is quite good. Now I will share it with you and give you a reference. Let’s follow the editor and take a look.

JS provides many convenient methods for operating arrays. What this article wants to share is how to quickly add, delete, modify, and check arrays.

1. Add

1. push()

can receive any number of parameters , add them to the end of the array one by one, and return the length of the modified array. For example:

var arr = [];
var len = arr.push(1);
console.log(arr); // [1]
console.log(len); // 1
len = arr.push(2,3);
console.log(arr); // [1,2,3]
console.log(len); // 3

2. unshift()

This method is similar to push() and can also receive any number of parameters. , it just adds parameters to the front of the array one by one, and also returns the new array length. Let’s continue the above example:

var len = arr.unshift(0);
console.log(arr); // [0, 1, 2, 3]
console.log(len); // 4
len = arr.unshift(-2,-1);
console.log(arr);  // [-2, -1, 0, 1, 2, 3]
console.log(len);  // 6

3. concat()

This method is somewhat similar to the push() method, the same It is to add elements to the end of the array, but this array is no longer the original array, but a copy of it, so concat() will return a new array after operating on the array. The specific usage is as follows:

① Without passing parameters, return a copy of the current array

② If one or more arrays are passed, this method will add each item in these arrays To the result array

③ Pass non-array parameters, these parameters will be added directly to the end of the result array

Continue with the above chestnut:

var arr1 = arr.concat(4,[5,6]);
console.log(arr);  // [-2, -1, 0, 1, 2, 3]
console.log(arr1);  // [-2, -1, 0, 1, 2, 3, 4, 5, 6]

It is clear from the example that the original array remains unchanged, and three elements 4, 5, and 6 are added to the end of the new array.

4. splice()

The previous three methods all have great limitations, because they are either added to the front of the array or after the array, and splice() It's different, it's very flexible and powerful. It is flexible because it can add elements to any position of the array, and it is powerful because in addition to adding elements, it also has the function of deleting and replacing elements (this will be discussed later).

splice() can add any number of elements to the specified position in the array. It needs to pass in at least 3 parameters: starting position, 0 (the number of elements to be deleted) and the elements to be added.

Continue with the above example:

arr.splice(3,0,0.2,0.4,0.6,0.8);
console.log(arr); // [-2, -1, 0, 0.2, 0.4, 0.6, 0.8, 1, 2, 3]

It can be seen that splice(), like push() and unshift(), is directly on the original array. Modified.

2. Delete

1. Pop()

cooperates with push() method Using a stack that can be constructed as last-in-first-out, this method removes the last item from the end of the array and returns that item.

Continue with the above example:

var item = arr.pop();
console.log(item);  // 3
console.log(arr);  // [-2, -1, 0, 0.2, 0.4, 0.6, 0.8, 1, 2]

2. shift()

Used in conjunction with the push() method A first-in-first-out queue can be formed. This method can delete the first item of the array and return it.

Continue with the above example:

var item = arr.shift();
console.log(item); // -2
console.log(arr); // [-1, 0, 0.2, 0.4, 0.6, 0.8, 1, 2]

3. slice()

This method is the same as concat() The same method returns a new array and does not affect the original array. However, slice() is used to clip the array and return the clipped array. The specific usage is as follows:

slice() method can accept one or two parameters, that is, the starting and ending positions of the item to be returned. With only one argument, the slice() method returns all items starting at the position specified by that argument and ending at the end of the current array. If given two arguments, this method returns items between the start and end positions—but not including the end position.

Let’s continue with the above example~~

var arr2 = arr.slice(2,6);
console.log(arr); // [-1, 0, 0.2, 0.4, 0.6, 0.8, 1, 2]
console.log(arr2); // [0.2, 0.4, 0.6, 0.8]

4, splice()

Okay, let’s continue talking about this “universal” method.

As mentioned above, this method needs to pass in more than 3 parameters when adding array elements, and the second parameter is used to specify the number of elements to be deleted. At that time, we passed Number 0. Then, if we only need to delete elements, we only need to pass in two parameters to splice(). The first parameter is used to specify the position of the first item to be deleted, and the second parameter is used to specify the position of the element to be deleted. number.

Continue the above example~~

arr.splice(2,4);
console.log(arr); // [-1, 0, 1, 2]

Delete 4 elements starting from the position where the index item is 2, so the result is [-1, 0, 1 , 2].

3. Change

In fact, the most flexible way is to directly use the powerful method splice(). In fact, through the above By understanding the method, we can roughly know the basic principle of using this method to modify array elements.

The principle is very simple, that is, insert any number of elements into the specified position and delete any number of elements at the same time.

Continue with the above example~~

arr.splice(2,1,0.5,1,1.5);
console.log(arr);  // [-1, 0, 0.5, 1, 1.5, 2]

4. Check

##indexOf() and lastIndexOf()

Both methods receive two parameters: the item to be found and (optional) the index indicating the starting position of the search. Among them, indexOf() searches backward from the beginning of the array (position 0), and the lastIndexOf() method searches forward from the end of the array.

For example:

var index = arr.indexOf(0);
console.log(index);  // 1
index = arr.indexOf(3,0);
console.log(index);  // -1

When the element is not found, -1 is returned, and the lastIndexOf() method is the same.

The above is the detailed content of Implementation of the addition, deletion, modification, and query functions of JavaScript arrays. For more information, please follow other related articles on the PHP Chinese website!