Splice and slice functions of JS

Have a look today JS Of Splice and slice, I was always confused before

Splice

it is to be noted that splice Method, you can modify the ！！！

Splice Methods can be Replace , modify , Delete Elements in an array , This method I understand as receiving 3 Parameters , See table for details .

Variable name	start	deleteCount	item1,item2,item3,…more
describe	Indexes , It can be understood as the array position to be manipulated ( This place can pass negative numbers , Pass negative numbers , You count backwards -1 Is the last element , Because the first element index is 0 Well )	The number of elements to be deleted from the index （ This place can pass negative numbers , Pass negative numbers , You count backwards -1 Is the last element , Because the first element index is 0 Well ） But write negative numbers and write 0 It's all the same , Don't delete elements , It doesn't make sense	Number of elements to add
Whether it is necessary to transmit	no ( Not transmitting is equivalent to starting from the index position , Delete all the following elements )	no	no

Example

Example 1

   	const arr = [1, 2, 3]
    const orderArr = arr.splice(1)
    console.log(arr) // [1]
    console.log(orderArr) // [2, 3]

so splice The return value of the method is the element you deleted , The array itself has also been modified

Example 2

    const arr = [1, 2, 3]
    //  The index is 1 Position of 4, Do not delete the elements in the array 
    const orderArr = arr.splice(1, 0, 4)
    console.log(arr)  // [1, 4, 2, 3]
    console.log(orderArr) // []

Example 3

	const arr = [1, 2, 3]
    //  The index is 1 Position of 4,5, Do not delete the elements in the array 
    const orderArr = arr.splice(1, 0, 4, 5)
    //  But I think it's more elegant 
    // arr.splice(1, 0, ...[4,5])
    console.log(arr) // [1, 4, 5, 2, 3] 
    console.log(orderArr) // []

Example 4

    const arr = [1, 2, 3]
    //  First delete the index as 1 The elements of , And then 4 Insert into index as 1 The place of 
    const orderArr = arr.splice(1, 1, 4)
    console.log(arr) // [1, 4, 3]
    console.log(orderArr) // [2]

Example 5

    const arr = [1, 2, 3]
    //  Delete index as -2 The elements of 
    const orderArr = arr.splice(-2, 1)
    console.log(arr) // [1, 3]
    console.log(orderArr) [2]

Example 6

    const arr = [1, 2, 3]
    //  Delete index as -2 To all subsequent elements 
    const orderArr = arr.splice(-2)
    console.log(arr) // [1]
    console.log(orderArr) // [2, 3]

Slice

slice Method does not modify the original array !!!

slice Method reception 2 Parameters

Variable name	begin	end
describe	The starting position to intercept	The end position to intercept ( Does not include end position )
Whether it is necessary to transmit	no ( The default value is 0, You can also pass negative numbers )	no ( Do not pass the default to the end of the array , You can also pass negative numbers )

Example

    const arr = [1, 2, 3]
    const orderArr = arr.slice(1, 3)
    console.log(arr) // [1, 2, 3]
    console.log(orderArr) // [2, 3]

tip

splice Method Vue It can be monitored , That is, you adjust the array splice Method , The change of array can affect the change of view

Blog

Welcome to my blog www.smartxy.cc