4

I have a problem with replace emoji in string to string with unicode.

For example:

I have string: const str = "My string is with emoji "

I need to convert this string to const str = "My string EMOJI UNICODE is with emoji EMOJI UNICODE"

emoji unicode should look like : [e-1f60e]. Because I have function for converting string with unicode to string with emoji:

function convertEmoji(str) {
  return str.replace(/\[e-([0-9a-fA-F]+)\]/g, (match, hex) =>
    String.fromCodePoint(Number.parseInt(hex, 16))
  );
}

console.log(convertEmoji('string [e-1f60e] sadfsadfsadf'));  // "string  sadfsadfsadf"
Anon
  • 307
  • 1
  • 5
  • 17

3 Answers3

11

You can use replace as you do in your function going the other way. This answer provides a regex for modern JavaScript that matches various "emoji" ranges. Then in the callback you can use codePointAt to get the value of the code point of the emoji, convert it to hex via toString(16), and return a string in your desired format:

const str = "My string  is with emoji "
const rex = /[\u{1f300}-\u{1f5ff}\u{1f900}-\u{1f9ff}\u{1f600}-\u{1f64f}\u{1f680}-\u{1f6ff}\u{2600}-\u{26ff}\u{2700}-\u{27bf}\u{1f1e6}-\u{1f1ff}\u{1f191}-\u{1f251}\u{1f004}\u{1f0cf}\u{1f170}-\u{1f171}\u{1f17e}-\u{1f17f}\u{1f18e}\u{3030}\u{2b50}\u{2b55}\u{2934}-\u{2935}\u{2b05}-\u{2b07}\u{2b1b}-\u{2b1c}\u{3297}\u{3299}\u{303d}\u{00a9}\u{00ae}\u{2122}\u{23f3}\u{24c2}\u{23e9}-\u{23ef}\u{25b6}\u{23f8}-\u{23fa}]/ug;
const updated = str.replace(rex, match => `[e-${match.codePointAt(0).toString(16)}]`);
console.log(updated);

See Wiktor's answer as well. ES2018 adds Unicode property escapes. But unfortunately, support is still spotty, though the one he uses in his answer works in Chromium and its derivatives (Chrome, Brave, Chromium Edge) and iOS Safari, though sadly not yet in Firefox.

T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
  • If anyone wants to do any testing, or create an even better regex themselves, [this](http://www.unicode.org/Public/emoji/12.0/) a good thing to look at. (For possible future viewers, don't look at this outdated emoji 12.0 version, Google what the latest version is) – 0x464e Jan 26 '20 at 14:40
5

If you target ECMAScript 2018 and newer, you may use

/\p{Emoji}/ug

JS demo:

const str = "My string  is with emoji ";
console.log(
  str.replace(/\p{Emoji}/ug, (m, idx) =>
   `[e-${m.codePointAt(0).toString(16)}]`
  )
);
Wiktor Stribiżew
  • 607,720
  • 39
  • 448
  • 563
  • This will work someday. :-) For now, sadly, Unicode property escapes are not well-supported. Even the latest Firefox doesn't handle this yet. Very pleased to see support in iOS Safari and Chrome/Chromium/Brave/ChromiumEdge though. – T.J. Crowder Jan 26 '20 at 12:36
  • Non-Chromium Edge doesn't support them (took a minute to test it). Fortunately that problem will solve itself soon. :-) – T.J. Crowder Jan 26 '20 at 12:44
  • 1
    Just in case, you may also check [Can I use *Unicode property escapes (`\p{...}`)*](https://caniuse.com/#feat=mdn-javascript_builtins_regexp_property_escapes) – Wiktor Stribiżew Jan 27 '20 at 08:16
  • Interestingly, that information is incorrect for Edge 79, which does support them. I'll see if I can do a PR. – T.J. Crowder Jan 27 '20 at 08:51
1

What you can do is, start with Array.from():

Array.from("My string  is with emoji ")

This will give you the separate characters into an array:

["M", "y", " ", "s", "t", "r", "i", "n", "g", " ", "", " ", "i", "s", " ", "w", "i", "t", "h", " ", "e", "m", "o", "j", "i", " ", ""]

Here, you can use the charCode function to check if the current item is an emoji and apply your custom function using the .map().

Check out How to convert one emoji character to Unicode codepoint number in JavaScript? for the initial conversion and use the Array.map() function to do the mapping and finally convert the array into string using .join("").

Note: I have explained the process of converting so that the OP can go ahead and try it out, and I intentionally didn't think of spoon-feeding the OP with the complete solution, even though I have got one, tried and tested.

Praveen Kumar Purushothaman
  • 164,888
  • 24
  • 203
  • 252