Array.slice javascript method: subtleties of use

Arrays in javascript have many specific useful methods that make data manipulation easier. Some of these functions modify the original object, others create modified or exact copies. The last group includes the useful Array.slice () method. It allows you to select any subarray from the array and use it separately.

Method Syntax

array.slice([begin[, end]])
      
      



As you can see, the method takes two arguments, but none of them is required.

The first parameter denotes the position of the beginning of the desired subarray, the second indicates the position of the element at which extraction will stop. Therefore, they must be integers.

If there is no end



argument, the method will work until the very end of the original array.

If both parameters are absent, array



will simply be copied completely.

The function can take negative arguments, and the position will begin to count from the end of the array.

Work examples

Consider the slice()



method using an example of a simple array of numbers:

 let arr = [5, 4, 3, 2, 1];
      
      



Getting a subarray from the first three elements:

 console.log(arr.slice(0, 3));
      
      



Here, the first argument is 0. It tells the function to start from zero position. And the second - 3, says that you need to stop at the element with index 3, not including it in the final selection. As a result, an array will be displayed on the console, including the numbers 5, 4 and 3.

Array.slice () method




Getting a subarray from the last three elements:





 console.log(arr.slice(-3));
      
      



To complete this task, only one argument is enough, which will indicate the beginning of the selection. A negative value initiates a count from the end of the array. In our case, this is an element with a value of 3. The final array includes the numbers 3, 2, 1.

Return value

The peculiarity of the javascript array.slice



() method is that it does not modify the object in the context of which it was called. This means that after all the operations performed, the arr



array has remained unchanged and can be used by the program for other purposes.

The function's job is to create a new array that is not related to the original one and fill it with selected elements. So that this array can be used in the future, it must be written to a variable.

 let arr = [5, 4, 3, 2, 1]; let newArr = arr.slice(1, 4); console.log(newArr); // [4, 3, 2] console.log(arr); // [5, 4, 3, 2, 1]
      
      



As you can see from the example, the arr



object remained unchanged. The result of the work of the method is a new array newArr



.

Array.slice () method




Copy Arrays

This mechanism allows you to automatically create copies without manually sorting each element of the sequence.

 let clone = arr.slice(); console.log(clone); // [5, 4, 3, 2, 1]
      
      



A method call without arguments starts copying from the very beginning to the end of the arr



array. The resulting clone is completely independent of its source and allows you to manipulate data without fear of losing them forever.

 clone[2]++; console.log(clone); // [5, 4, 4, 2, 1] console.log(arr); // [5, 4, 3, 2, 1]
      
      



It is important to remember here that objects in javascript are passed by reference. Therefore, if the elements of the sequence are objects, then their change in the copy will entail the same change in the source.

 let arr = [ {a: 1}, [2, 3] ]; //    let newArr = arr.slice(); console.log(newArr); // [ {a: 1}, [2, 3] ] //   newArr[0].a = 7; console.log(newArr); // [ {a: 7}, [2, 3] ] //     console.log(arr); // [ {a: 7}, [2, 3] ]
      
      



Without fear, you can work with strings, numbers and Boolean values, since they are completely copied into a new sequence.

At the same time, adding and deleting elements within the cloned array does not affect the original in any way.




All Articles