All three methods are used to intercept strings, so why do we need so many methods? Today we will explore the differences:

substring()

The substring() method returns a subset of a string from the start index to the end index, or from the start index to the end of the string.

grammar

str.substring(start, stop)

parameter describe
start Required, the index of the first character to be truncated, the character at the index position to be returned as the first letter of the string
stop Optional, an integer between 0 and the length of the string. The string indexed by this number is not included in the truncated string 
var str = 'abcdefg';

str.substring(0.3) // abc; [including 0, excluding 3]
str.substring(3.0) // abc; [Will treat small values as start and large values as stop]
str.substringn(3, -3) // abc; [Negative values are not allowed, negative values will automatically become 0]
str.substring(3.NaN) // abc; [Non-value converted to 0]
str.substring(3.3) // "[start === stop, return empty string]
str.substring(0.7) // abcdefg
str.substring(0.10) // abcdefg [beyond the length of STR, take the whole length]
Copy the code

substr()

The substr() method returns a string of characters from the specified position up to the specified number of characters.

grammar

str.substr(start, length)

parameter describe
start A necessity. The starting index of the substring to extract. It has to be a number. If it is negative, the argument declares the position from the end of the string. That is, -1 is the last character in the string, -2 is the second-to-last character, and so on.
length Optional. Number of characters in a substring. It has to be a number. If this parameter is omitted, the string from the beginning of stringObject to the end is returned.

Notice that the second argument islengthWhile the substring isstop, from this literal meaning should also be able to mean some difference!

var str = 'abcdefghij';

str.substr(1.2) // BC [start from first, select two values]
str.substr(-3.2) // select * from str.length-3; // select * from str.length-3;
str.substr(-3) // hij [drop leng, drop leng]
str.substr(3.0); str.substr(3, -2); // "[substr returns an empty string if length is 0 or negative]
// ** note that the length is 0 and the ellipse is different. **
str.substr(-20.2); str.substr(-19.2) // ab [if start is negative and exceeds the total length of the string, it counts as starting from 0]
str.substr(11.2) // "[start exceeds total string length, returns empty string]
Copy the code

PS: Warning: Although String.prototype.substr(…) It is not strictly removed (as in “removed from the Web standards”), but it is considered a legacy function and should be avoided if possible. It is not part of the JavaScript core language and will probably be removed in the future. If possible, use substring() instead.

slice()

The slice() method extracts a portion of a string and returns a new string, leaving the original string unchanged.

grammar

str.slice(start, end)

parameter describe
start A necessity. Specify where to start. If it is negative, it specifies the position from the end of the array. That is, -1 is the last element, -2 is the next-to-last element, and so on.
end Optional. Specify where to end the selection. This parameter is the array subscript at the end of the array fragment. If this parameter is not specified, the shard array contains all elements from start to the end of the array. If this parameter is negative, it specifies the element from the end of the array. 
var str = 'The morning is upon us.'; // The length of STR is 23.

str.slice(1.8); // he morn [1, 8]
str.slice(4, -2); // Morning is upon u [end = 23-2=21, so equal to slice(4, 21)]
str.slice(12); // is upon us.
str.slice(30); // "[start exceeds string length, return empty string]

str.slice(-3); // 'us.' [start = negative, length-3, so equivalent to slice(20)]
str.slice(-3, -1); // 'us' [equivalent to slice(20, 22)]
Copy the code

Arrays also have slice, by the way

That’s the difference, help yourself… Keep in mind that the authorities already want to scrap itsubstr()So use it with caution…