Javascript 在字符串中查找表情符号并解析

问题描述 投票:0回答:7

经过大量研究,我找到了如何使用 Twemoji 库实时解析表情符号。

现在,我需要弄清楚如何识别某些文本中是否有表情符号,抓取该表情符号的位置并执行解析函数。

一些示例文本可以是

It is a great day 😀.

需要在整个字符串中找到 😀 并使用以下函数获取其十六进制代码,返回代理对并使用 Twemoji 库进行解析。

function entityForSymbolInContainer(selector) {
    var code = data.message.body.codePointAt(0);
    var codeHex = code.toString(16);
    while (codeHex.length < 4) {
        codeHex = "0" + codeHex;
    }

    return codeHex;
}

// Get emoji hex code
    var emoji = entityForSymbolInContainer(data.message.body);
// For given an HEX codepoint, returns UTF16 surrogate pairs
    var emoji = twemoji.convert.fromCodePoint(emoji);
// Given a generic string, it will replace all emoji with an <img> tag
    var emoji = twemoji.parse(emoji);

我正在使用以下检查来查看文本中是否有表情符号。问题是,对于一个简单的笑脸(😀),它不会提醒我。但是,如果我输入“衬衫和领带”(👔),它会提醒我这一点。

var string = "It is a great day 😀.";
var emojiRegex = /([\uE000-\uF8FF]|\uD83C[\uDF00-\uDFFF]|\uD83D[\uDC00-\uDDFF])/g;

if (string.match(emojiRegex)) {
    alert("emoji found");
}

请帮助解决正则表达式不拾取表情符号的问题。之后,我应该能够在字符串中找到它。

谢谢!

javascript string emoji
7个回答
10
投票

如今,在 ES2018 中,我们可以在正则表达式匹配中使用 Unicode 属性转义:

\p{…}

对于简单的表情符号,它是:

"Be kind 😊, smile".match(/\p{Emoji}+/gu)

对于包括用 ZERO WIDTH JOINER 粘合的字形的表情符号,例如 👨u200d👩u200d👧u200d👦,它可以是:

"My Family 👨‍👩‍👧‍👦".match(/[\p{Emoji}\u200d]+/gu)

9
投票

在 2021 年,实现这一目标的最佳方法是使用 ES6 带来的正则表达式中对 unicode 的支持。

就像使用这个正则表达式一样简单:

/(\p{Emoji_Presentation}|\p{Extended_Pictographic})/gu

例如,这个简单的函数将用空格替换字符串中的所有表情符号:

function removeEmojis(str) {
    var emojiRE = /(\p{Emoji_Presentation}|\p{Extended_Pictographic})/gu;
    return str.replace(emojiRE, '');
}

removeEmojis('This ❌ h🅰s some 😱 emojis inside'); //'This  hs some  emojis inside'

它同时使用

Emoji_Representation
Extended_Pictographic
属性,因此它不会对搜索中的数字、
#
*
进行计数,如 Unicode 标准所示

我们也可以使用这些属性的缩写,以获得更短的正则表达式:

/(\p{EPres}|\p{ExtPict})/gu

您可以在这里试驾:

function removeEmojis(str) {
    var emojiRE = /\p{EPres}|\p{ExtPict}/gu;
    return str.replace(emojiRE, '');
}

var testStr = 'This ❌ h🅰s some 😱 emojis inside';
console.log('Test string: ' + testStr);
console.log('Result: ' + removeEmojis(testStr));


6
投票

这篇文章提供了一个非常全面的正则表达式,用于匹配表情符号,并提供了很好的解释。他的正则表达式基于 lodash 库发布的正则表达式。

(?:[\u2700-\u27bf]|(?:\ud83c[\udde6-\uddff]){2}|[\ud800-\udbff][\udc00-\udfff]|[\u0023-\u0039]\ufe0f?\u20e3|\u3299|\u3297|\u303d|\u3030|\u24c2|\ud83c[\udd70-\udd71]|\ud83c[\udd7e-\udd7f]|\ud83c\udd8e|\ud83c[\udd91-\udd9a]|\ud83c[\udde6-\uddff]|[\ud83c[\ude01-\ude02]|\ud83c\ude1a|\ud83c\ude2f|[\ud83c[\ude32-\ude3a]|[\ud83c[\ude50-\ude51]|\u203c|\u2049|[\u25aa-\u25ab]|\u25b6|\u25c0|[\u25fb-\u25fe]|\u00a9|\u00ae|\u2122|\u2139|\ud83c\udc04|[\u2600-\u26FF]|\u2b05|\u2b06|\u2b07|\u2b1b|\u2b1c|\u2b50|\u2b55|\u231a|\u231b|\u2328|\u23cf|[\u23e9-\u23f3]|[\u23f8-\u23fa]|\ud83c\udccf|\u2934|\u2935|[\u2190-\u21ff])

https://medium.com/@thekevinscott/emojis-in-javascript-f693d0eb79fb


3
投票

这确定评论中是否有表情符号。

var unified_emoji_ranges = ['\ud83c[\udf00-\udfff]','\ud83d[\udc00-\ude4f]','\ud83d[\ude80-\udeff]'];

var reg = new RegExp(unified_emoji_ranges.join('|'), 'g');

var string = "It is a great day 😀.";

if (string.match(reg)) {
    alert("emoji found");
}

0
投票

问题:

JavaScript 将字符串定义为 UTF-16 代码序列 单位,而不是字符序列或代码点。

(引自以下来源)

您必须使用代理对设置正则表达式:

我在这里找到了一个很好的解决方案/解释在javascript中解析表情符号unicode,无需额外的库。 这是一个在线代理对计算器

就你而言:

/\uD83D\uDE00/

正则表达式101


0
投票

如果有人仍在寻找 JS 中的解决方案以在字符串中查找表情符号。

可以使用以下(表情符号正则表达式)。

以下示例将所有表情符号转换为给定字符串中字符的 Unicode 十六进制数字表示形式:

import emojiRegex  from 'emoji-regex/RGI_Emoji.js';
const emojiRegexPattern = emojiRegex();
const stringThatMightHaveEmojis = ...; //some string that can contain emoji's..

stringThatMightHaveEmojis.replace(emojiRegexPattern,(m, idx) => {
      return `${m.codePointAt(0).toString(16)}]`;
    })

库的文档中有更多示例。

加上我偶然发现的一篇有用的文章,解释解析表情符号,可以在here

找到codePointAt

0
投票

您可以将任何有效的表情符号字符与

\p{RGI_Emoji}
Unicode 属性类匹配(注意使用
v
标志
):

let text = "It is a great day 😀."
text = text.replace(/\p{RGI_Emoji}/vg,(m) => {
      return '\\u'+m.split("").map(x => x.charCodeAt(0).toString(16)).join('\\u');
    })
console.log(text)

结果是

It is a great day \ud83d\ude00.

© www.soinside.com 2019 - 2024. All rights reserved.