Know the Difference Between Slice( ) and Splice( ) in JavaScript

Know the Difference Between Slice( ) and Splice( ) in JavaScript

With Awesome Examples.

SURYA L's photo
SURYA L
·Jun 22, 2022·

3 min read

Subscribe to my newsletter and never miss my upcoming articles

Play this article

Table of contents

Hello everyone, hope you are all doing well. My name is Surya L, and the aim of this blog is to teach you the Difference Between Slice( ) and Splice( ) in JavaScript.

JavaScript slice( ):

  • Slice Method is used to create a new array from a subarray of a given array.
  • The Changes are not reflected in the Original Array.
  • The result must be assigned to a new array variable.
  • Returns a new array with values from the sub-array of the given array.
  • This value will be selected from the start to (end-1) range.
  • This function takes two arguments, starting and ending ranges.

  • For example:

  • Syntax

    arr.slice(start range,end range);
    
  • Example 1: Both the start and end are specified.

var day = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"];
var new_Day = day.slice(1, 4);
console.log("day :", day, "new_Day :", new_Day);
  • Output:
day : [
  'Mon', 'Tue',
  'Wed', 'Thu',
  'Fri', 'Sat',
'Sun']
new_Day : [ Wed, Thu, Fri ]
  • Example 2: only the start is specified. The end is by default the length of the array.

var day = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"];
var new_Day = day.slice(2);
console.log("day :", day);
console.log("new_Day :", new_Day);
  • Output:
day : [
  'Mon', 'Tue',
  'Wed', 'Thu',
  'Fri', 'Sat',
  'Sun'
]
new_Day : [ 'Wed', 'Thu', 'Fri', 'Sat', 'Sun' ]

JavaScript splice( )

  • You can use the splice( ) method to add or remove an item from an array.
  • The original array reflects the changes.
  • The result does not need to be assigned to another variable.
  • The returned value is an array containing the deleted element.
  • Takes 'n' arguments (a list of new items can be special).
  • For example:
  • Syntax

    arr.splice(i, n, item 1, item 2, .....item n);
    
  • Example 1: Now let us just add some more items but not remove any item.

    var cars=['Benz', 'Innova', 'Breeza', 'Etios', 'Dzire'];
    cars.splice(2, 0, 'ambassedor', 'BMW', 'Audi');
    console.log("cars :", cars);
    
  • Output:

    cars : [ 'Benz', 'Innova', 'ambassedor', 'BMW', 'Audi',
    'Breeza','Etios', 'Dzire']
    
  • Example 2: Removing one element and not adding any new item

    var cars = [ "Benz", "Innova","ambassedor", "BMW",
    "Audi","Breeza","Etios","Dzire",];
    cars.splice(2, 1);
    console.log("cars :", cars);
    
  • Output

    cars : [ 'Benz',   'Innova', 'BMW',    'Audi', 'Breeza', 'Etios','Dzire']
    
  • Example 3: Removing more than one element and not adding any new item.

    var cars = [ "Benz","Innova","ambassedor","BMW", "Audi",
    "Breeza","Etios","Dzire",];
    cars.splice(2, 3);
    console.log("cars :", cars);
    
  • Output:

    cars : [ 'Benz', 'Innova', 'Breeza', 'Etios', 'Dzire' ]
    

Conclusion:

  • Slice Method is used to create a new array from a subarray of a given array.

  • You can use the splice( ) method to add or remove an item from an array.

Thanks for reading the blog. Do let me know what you think about it.

You can connect me with Showwcase Twitter Blog GitHub Contact Me

Reference: I learned this topics in GeeksForGeek which I explained in minified version

Did you find this article valuable?

Support SURYA L by becoming a sponsor. Any amount is appreciated!

See recent sponsors Learn more about Hashnode Sponsors
 
Share this