Substring vs Slice vs Other?

Question

According to MDN, substr is considered legacy code that may eventually become deprecated.

Hence I'm wondering whether substring or slice is better suited for inserting strings into other strings at specific indices?

Or is there another method that is actually intended for this very purpose?

What I'm doing is detecting user input via keydown, which I then, in some cases, intercept and extrapolate to manually pass on the value.

input.onkeydown = function(e){
  if (e.key === 'x'){
    return false
  }
  this.value = // insert character at this.selectionEnd into this.value
  return false
}

The reason I'm doing this is so that I can manage and restrict user input while guaranteeing the output is formatted in a particular way. In other words, the user will not have to format his/her input.

@RamSegev this isnt a duplicate... im not really concerned about the differences, but rather which is better suited for inserting strings into other strings since doing so is the purpose of neither, nor any other method that im aware of... — oldboy, Jul 21 '19 at 06:48
`to inserting strings into other strings at specific indices?` It's not entirely clear what you're looking for here - example code would help clarify things — CertainPerformance, Jul 21 '19 at 06:49
@CertainPerformance i added some code to give u an idea what im doing and why — oldboy, Jul 21 '19 at 06:55
You're taking input from user using input tag right ? why not use `pattern` and provide regex pattern to it, it won't allow user to add restricted values — Code Maniac, Jul 21 '19 at 06:58
@CodeManiac correct, from an `input[type=text]` which i will then be assigning to an `input[type=number` behind the scenes, and then displaying the properly formatted dollar figure in the `input[type=text]` — oldboy, Jul 21 '19 at 07:02

score 4 · Accepted Answer · edited Jun 20 '20 at 09:12

The difference between them is:

The substring() method swaps its two arguments if indexStart is greater than indexEnd, meaning that a string is still returned. The slice() method returns an empty string if this is the case.

If either or both of the arguments are negative or NaN, the substring() method treats them as if they were 0.

slice() also treats NaN arguments as 0, but when it is given negative values it counts backwards from the end of the string to find the indexes.

Since you already have a reference to the string as this.value, and since you can calculate the lower and upper indicies directly (without passing negative indicies or NaN, or anything silly like that), it makes absolutely no difference whether you use substring or slice if you want to insert a particular character. Use whichever you want, it won't have any effect for an operation like this.

this.value = this.value.slice(0, selectionEnd) + 'z' + this.value.slice(selectionEnd);

or

this.value = this.value.substring(0, selectionEnd) + 'z' + this.value.substring(selectionEnd);

both work fine.

input.onkeydown = function(e){
  const { selectionEnd } = this;
  this.value = this.value.substring(0, selectionEnd) + 'z' + this.value.substring(selectionEnd);
  this.selectionEnd = selectionEnd + 1;
  return false;
}

<input id="input" value="abc">

Are/is there other/another method that is meant specifically for inserting strings at particular indices? If not, then I basically have to chop up the string myself, insert what I need to insert or delete what I need to delete, then piece the string back together again? — oldboy, Jul 21 '19 at 07:05
Not really, but it's not like calculating indicies is hard at all. If you have multiple complicated operations, you can use an array instead (allowing you to do stuff like `splice`), but that's inefficient and usually not useful — CertainPerformance, Jul 21 '19 at 07:08
Alright. One last thing: Do you know if one or the other is more efficient/performs better than the other? — oldboy, Jul 21 '19 at 07:10
They both do nearly the exact same thing - if there's a difference, it's insignificant https://jsperf.com/slice-vs-substr-vs-substring-methods-long-string/19 — CertainPerformance, Jul 21 '19 at 07:13

Substring vs Slice vs Other?

1 Answers1

Linked