Open In App

Difference between String.slice and String.substring in JavaScript

Improve
Improve
Like Article
Like
Save
Share
Report

These 2 functions are quite similar in their Syntax But are different in some cases. Let’s see the difference between them.

JavaScript slice() Method:

This method selects the part of a string and returns the selected part as a new string. Start and end parameters are used to specify the extracted part. The first character starts with index 0. 

Syntax:

str.slice(start, end)

JavaScript substring() Method:

This function has the same syntax as slice() This method selects the part of a string and returns the selected part as a new string. Start and end parameters are used to specify the extracted part. The first character starts with index 0. 

Syntax:

str.substring(start, end)

Common Result Both give the same results in the given cases.

  • If start == stop, both return an empty string
  • If the stop is omitted, both extracts characters till the end of the string
  • If any argument is greater than the string’s length, the string’s length will be used in that case.

JavaScript substring() different results of substring()

  1. If start > stop, then the function swaps both arguments.
  2. If any argument is negative or is NaN, it is treated as 0.

JavaScript slice() different results of slice()

  1. If start > stop, This function will return an empty string. (“”)
  2. If the start is negative, It sets char from the end of the string, like substr().
  3. If stop is negative, It sets stop = string.length – Math.abs(stop) (original value)

Example 1: These examples give the same results in both cases. 

Javascript




// Input string
let str = "This is GeeksForGeeks";
console.log("Str = '" + str + "'");
 
// Function to display output difference
function Geeks() {
    console.log("str.slice() = " + str.slice(0, 13));
    console.log(
        "str.substring() = " + str.substring(0, 13)
    );
}
 
// Function call
Geeks();


Output

Str = 'This is GeeksForGeeks'
str.slice() = This is Geeks
str.substring() = This is Geeks

Example 2:In this Example, In the case of substring() it swaps the arguments when start>stop where the slice() returns the empty string. 

Javascript




// Input string
let str = "This is GeeksForGeeks";
console.log("Str = '" + str + "'");
 
// Function to display output difference
function Geeks() {
    console.log("str.slice() = " + str.slice(13, 0));
    console.log(
        "str.substring() = " + str.substring(13, 0)
    );
}
 
// Function call
Geeks();


Output

Str = 'This is GeeksForGeeks'
str.slice() = 
str.substring() = This is Geeks

Example 3:In this Example, In the case of substring() negative arguments are treated as 0 where the slice() returns the empty string. 

Javascript




// Input string
let str = "This is GeeksForGeeks";
console.log("Str = '" + str + "'");
 
// function to display output diff
function Geeks() {
    console.log("str.slice() = " + str.slice(-13, 7));
    console.log(
        "str.substring() = " + str.substring(-13, 7)
    );
}
 
// Function call
Geeks();


Output

Str = 'This is GeeksForGeeks'
str.slice() = 
str.substring() = This is

Differences between slice() and substring() methods:

JavaScript string.slice() Method

JavaScript string.substring() Method

It is used to extract a part of the string It is used to extract a substring in a string
Its return value is a string because it returns some part of the string. It does not distort the original string
It takes parameters as integers i.e; the indexes of the string from where we want to extract the string Its parameters are the start and end position of the substring that  we want to extract
It is an in-built string method in Javascript It is also an in-built string method in Javascript.
It does not distort the original string Its return value is of type string


Last Updated : 21 Jul, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads