Tag: slice

Substring() vs Slice() in JavaScript

What is substring()?

substring() method returns part of the string from start index upto end index but excluding the endindex. It extracts characters between two indices from a string and return the substring. It does not change the original string.

Syntax:
substring(indexStart)
substring(indexStart, indexEnd)

Parameters:

indexStart – Index of first character to include in substring.

indexEnd – It is optional. It denotes the first character to exclude from the returned string.

When indexEnd is not there, the substring() method returns characters upto the end of the string.

Return value – A new sub string containing part of original string.

What will happen if both index start and end are same?

const str = ‘Abaython’
str.substring(3,3)

When both start and end index are same will return an empty string.

If start index greater than end index?

const str = ‘Abaython’
str.substring(4,2)
Output:

ay

Here it will simply swap the parameters as,

str.substring(2,4)

So, the output is ay.

If indexEnd is omitted?

const str = ‘Abaython’
str.substring(4)
Output:

thon

Here it will return upto the end of the string starting from index 4

Substring() vs slice()

Though in both methods the parameters are same, the main difference is using negative values.

In substring() method negative values are considered as zero.

const s = 'Abaython';
console.log(s.substring(-4,5))
Output:

Abayt

Here -4 is considered as 0 and returns from the start of the string.

Keypoints to note:

Similarities:

  • In both methods the parameters are same. If start and end index are equal both returns an empty string.
  • If end index is omitted then the characters are extracted upto the end of the string.
  • Any parameter greater than string length then string length is used instead.
  • NaN treated as 0.

Differences:

  • In case of startindex > endindex,

Substring() method swaps the parameters.

Slice() method returns empty string

  • If any argument has negative values,

Substring() method treats them as 0

Slice() method counts from the end of the string for negative values

Javascript slice() method:

Slice() method extracts a part of string and returns a new string without modifying the original string. It requires the index as start and end parameters for returning part of the string. Here negative index are allowed.

Syntax:

slice(indexStart)

slice(indexStart, indexEnd)

Here the parameter indexEnd is optional.

indexStart – index of first character to include in the returned string. If negative, this argument specifies a position from the end of the string. For example -1 indicates the last character and -2 indicates the second character from last.

indexEnd – index of first character to exclude from the returned string. As this is optional if not specified it includes all character from indexStart to end of string. Same as above, if negative argument, it specifies  a position measured from the end of the string.

Return value – A new string containing the extracted section of the string.

Example:
const s = 'Abaython';
console.log(s.slice(0,4))  
console.log(s.slice(2,4))  
console.log(s.slice(4))      
console.log(s.slice(3,-1)) 
console.log(s.slice(3,-2))  
console.log(s.slice(-3,-1))
Output:

Abay

ay

thon

ytho

yth

ho

indexStart>=index.length?

It returns an empty string.

indexStart omitted?

If indexStart is omitted, undefined or cannot be converted to a number. It consider indexStart as 0 and returns from  the start of the string.

const s = 'Abaython';
s.slice()
Output:

‘Abaython’

String methods slice(), substring() and the deprecated substr() all return specified portions of a string. Slice() is more flexible than substring() because it allows negative index values. Slice() differs from substr() in that it specifies a substring with two character positions, while substr() uses one position and a length. String.slice() is an analog of Array.slice()