[javascript] How to remove text from a string?

I've got a data-123 string.

How can I remove data- from the string while leaving the 123?

This question is related to javascript string

The answer is


Performance

Today 2021.01.14 I perform tests on MacOs HighSierra 10.13.6 on Chrome v87, Safari v13.1.2 and Firefox v84 for chosen solutions.

Results

For all browsers

  • solutions Ba, Cb, and Db are fast/fastest for long strings
  • solutions Ca, Da are fast/fastest for short strings
  • solutions Ab and E are slow for long strings
  • solutions Ba, Bb and F are slow for short strings

enter image description here

Details

I perform 2 tests cases:

  • short string - 10 chars - you can run it HERE
  • long string - 1 000 000 chars - you can run it HERE

Below snippet presents solutions Aa Ab Ba Bb Ca Cb Da Db E F

_x000D_
_x000D_
// https://stackoverflow.com/questions/10398931/how-to-strToRemove-text-from-a-string

// https://stackoverflow.com/a/10398941/860099
function Aa(str,strToRemove) {
  return str.replace(strToRemove,'');
}

// https://stackoverflow.com/a/63362111/860099
function Ab(str,strToRemove) {
  return str.replaceAll(strToRemove,'');
}

// https://stackoverflow.com/a/23539019/860099
function Ba(str,strToRemove) {
  let re = strToRemove.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); // regexp escape char
  return str.replace(new RegExp(re),'');
}

// https://stackoverflow.com/a/63362111/860099
function Bb(str,strToRemove) {
  let re = strToRemove.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); // regexp escape char
  return str.replaceAll(new RegExp(re,'g'),'');
}

// https://stackoverflow.com/a/27098801/860099
function Ca(str,strToRemove) {
  let start = str.indexOf(strToRemove);
  return str.slice(0,start) + str.slice(start+strToRemove.length, str.length);
}

// https://stackoverflow.com/a/27098801/860099
function Cb(str,strToRemove) {
  let start = str.search(strToRemove);
  return str.slice(0,start) + str.slice(start+strToRemove.length, str.length);
}

// https://stackoverflow.com/a/23181792/860099
function Da(str,strToRemove) {
  let start = str.indexOf(strToRemove);
  return str.substr(0, start) + str.substr(start + strToRemove.length);
}

// https://stackoverflow.com/a/23181792/860099
function Db(str,strToRemove) {
  let start = str.search(strToRemove);
  return str.substr(0, start) + str.substr(start + strToRemove.length);
}

// https://stackoverflow.com/a/49857431/860099
function E(str,strToRemove) {
  return str.split(strToRemove).join('');
}

// https://stackoverflow.com/a/45406624/860099
function F(str,strToRemove) {
    var n = str.search(strToRemove);
    while (str.search(strToRemove) > -1) {
        n = str.search(strToRemove);
        str = str.substring(0, n) + str.substring(n + strToRemove.length, str.length);
    }
    return str;
}


let str = "data-123";
let strToRemove = "data-";

[Aa,Ab,Ba,Bb,Ca,Cb,Da,Db,E,F].map( f=> console.log(`${f.name.padEnd(2,' ')} ${f(str,strToRemove)}`));
_x000D_
This shippet only presents functions used in performance tests - it not perform tests itself!
_x000D_
_x000D_
_x000D_

And here are example results for chrome

enter image description here


You can use "data-123".replace('data-','');, as mentioned, but as replace() only replaces the FIRST instance of the matching text, if your string was something like "data-123data-" then

"data-123data-".replace('data-','');

will only replace the first matching text. And your output will be "123data-"

DEMO

So if you want all matches of text to be replaced in string you have to use a regular expression with the g flag like that:

"data-123data-".replace(/data-/g,'');

And your output will be "123"

DEMO2


you can use slice() it returens charcters between start to end (included end point)

   string.slice(start , end);

here is some exmp to show how it works:

var mystr = ("data-123").slice(5); // jast define start point so output is "123"
var mystr = ("data-123").slice(5,7); // define start and end  so output is "12"
var mystr=(",246").slice(1); // returens "246"

Demo


I was used to the C# (Sharp) String.Remove method. In Javascript, there is no remove function for string, but there is substr function. You can use the substr function once or twice to remove characters from string. You can make the following function to remove characters at start index to the end of string, just like the c# method first overload String.Remove(int startIndex):

function Remove(str, startIndex) {
    return str.substr(0, startIndex);
}

and/or you also can make the following function to remove characters at start index and count, just like the c# method second overload String.Remove(int startIndex, int count):

function Remove(str, startIndex, count) {
    return str.substr(0, startIndex) + str.substr(startIndex + count);
}

and then you can use these two functions or one of them for your needs!

Example:

alert(Remove("data-123", 0, 5));

Output: 123


str.split('Yes').join('No'); 

This will replace all the occurrences of that specific string from original string.


Another way to replace all instances of a string is to use the new (as of August 2020) String.prototype.replaceAll() method.

It accepts either a string or RegEx as its first argument, and replaces all matches found with its second parameter, either a string or a function to generate the string.

As far as support goes, at time of writing, this method has adoption in current versions of all major desktop browsers* (even Opera!), except IE. For mobile, iOS SafariiOS 13.7+, Android Chromev85+, and Android Firefoxv79+ are all supported as well.

* This includes Edge/ Chrome v85+, Firefox v77+, Safari 13.1+, and Opera v71+

It'll take time for users to update to supported browser versions, but now that there's wide browser support, time is the only obstacle.

References:

You can test your current browser in the snippet below:

_x000D_
_x000D_
//Example coutesy of MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replaceAll
const p = 'The quick brown fox jumps over the lazy dog. If the dog reacted, was it really lazy?';

const regex = /dog/gi;

try {
  console.log(p.replaceAll(regex, 'ferret'));
  // expected output: "The quick brown fox jumps over the lazy ferret. If the ferret reacted, was it really lazy?"

  console.log(p.replaceAll('dog', 'monkey'));
  // expected output: "The quick brown fox jumps over the lazy monkey. If the monkey reacted, was it really lazy?"
  console.log('Your browser is supported!');
} catch (e) {
  console.log('Your browser is unsupported! :(');
}
_x000D_
.as-console-wrapper: {
  max-height: 100% !important;
}
_x000D_
_x000D_
_x000D_


Plain old JavaScript will suffice - jQuery is not necessary for such a simple task:

var myString = "data-123";
var myNewString = myString.replace("data-", "");

See: .replace() docs on MDN for additional information and usage.


Using match() and Number() to return a number variable:

Number(("data-123").match(/\d+$/));

// strNum = 123

Here's what the statement above does...working middle-out:

  1. str.match(/\d+$/) - returns an array containing matches to any length of numbers at the end of str. In this case it returns an array containing a single string item ['123'].
  2. Number() - converts it to a number type. Because the array returned from .match() contains a single element Number() will return the number.

Ex:-

var value="Data-123";
var removeData=value.replace("Data-","");
alert(removeData);

Hopefully this will work for you.


This doesn't have anything to do with jQuery. You can use the JavaScript replace function for this:

var str = "data-123";
str = str.replace("data-", "");

You can also pass a regex to this function. In the following example, it would replace everything except numerics:

str = str.replace(/[^0-9\.]+/g, "");

This little function I made has always worked for me :)

String.prototype.deleteWord = function (searchTerm) {
    var str = this;
    var n = str.search(searchTerm);
    while (str.search(searchTerm) > -1) {
        n = str.search(searchTerm);
        str = str.substring(0, n) + str.substring(n + searchTerm.length, str.length);
    }
    return str;
}

// Use it like this:
var string = "text is the cool!!";
string.deleteWord('the'); // Returns text is cool!!

I know it is not the best, but It has always worked for me :)