1

How to replace all occurrences that are within two characters. Example:

I love :octocat: beach and you do :joy: not like it

Replace with a url that will be generated based on what's inside the delimiters

I love [img of octocat] beach and you do [img of joy] not like it

Javascript needs to capture what's inside : and replace

I've tried several things without success. can anybody help me?

Jobsdev
  • 1,047
  • 3
  • 11
  • 28
  • Possible duplicate of [How to replace all occurrences of a string in JavaScript?](https://stackoverflow.com/questions/1144783/how-to-replace-all-occurrences-of-a-string-in-javascript) – Heretic Monkey Jun 05 '17 at 17:16
  • Have you looked into regular expressions? Read https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions and https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace – sbking Jun 05 '17 at 17:16
  • Is not repeated. Need to replace text that are between delimiter characters. I do not know what's inside the delimiters. I simply need to take what's inside and replace it with something else. – Jobsdev Jun 05 '17 at 17:21
  • @DaniloSantos what is `something else`? Care to eleborate? – jdmdevdotnet Jun 05 '17 at 17:22
  • Sorry for my English. I am still studying. I'm going to fix it – Jobsdev Jun 05 '17 at 17:25
  • Well I mean you say you want to replace it with something else, but in order to find a good solution we need to know what you are replacing with. – jdmdevdotnet Jun 05 '17 at 17:26
  • I'm going to replace it with an img. They are emoji. I need to capture what's between : : mount a url and display an image; – Jobsdev Jun 05 '17 at 17:30

3 Answers3

2

Lucky for you String.prototype.replace accepts a RegExp and a function. So, in your example you can write a regex to find strings between 2 characters and replace them.

The RegEx for your example using colons would simply be /:(.*?):/g, and you could do whatever you want in your function, e.g. replace the string with the string + additional characters. e.g.

var str = "I love :octocat: beach and you do :joy: not like it"
str = str.replace(/:(.*?):/ig, function (str){
  return str + 'BLAHBLAHBLAH'
})

The value of str is now "I love :octocat:BLAHBLAHBLAH beach and you do :joy:BLAHBLAHBLAH not like it", fun stuff eh?

Joe Thomas
  • 5,807
  • 6
  • 25
  • 36
1

Use String.replace with a callback function querying a map {'pattern': 'replacement'}:

let str = 'I love :octocat: beach and you do :joy: not like it';

let replacements = {
  'octocat': '[img of octocat]',
  'joy': '[img of joy]'
};

let result = str.replace(/:(\w+):/g, (match, word) => replacements[word]);
console.log(result);
le_m
  • 19,302
  • 9
  • 64
  • 74
0

Shrtfrm:

"I love :octocat: beach and you do :joy: not like it".split(":").map((el,i)=>i%2===0?el:{"octocat":"hello","joy":"test"}[el]||el).join("");

Simply split, replace and join again.

http://jsbin.com/moxexilica/edit?console

Explanation:

.split(":")
//returns: ["I love ","octocat"," beach and you do ","joy"," not like it"]
.map((el,i)=>i%2===0?el
//leave the strings outside (indexes 0,2,4) as they are
:el{"octocat":"hello","joy":"test"}[el]
//replace the others (indexes 1,3) with the value in the object so:
// octocat => hello
//joy => test
||el
//if it does not exist e. g. ':test:' fall back to 'test'
//now weve got:
//["I love ","hello"," beach and you do ","test"," not like it"]
.join("")
//a string

Extracted to a function:

function replace(str,replacer){
  return str.split(":").map((el,i)=>i%2===0?el:replacer[el]||el).join("");
}

So you can do:

alert(replace("I love :octocat: beach and you do :joy: not like it", {octocat:"manly",joy:"not"}));

With images:

document.body.innerHTML=replace(document.body.innerHTML, {octocat:"<img src='octocat.png' />",joy:"<img src='joy.png' />"});

Note that ":" is not a good delemiter. You may use a more uncommon one like %% or !! ...

Jonas Wilms
  • 132,000
  • 20
  • 149
  • 151