Question

嘿，我目前遇到一些问题，需要在带有图像的文本中检测字符串。

{"a":"img1.jpg", "ab":"img2.jpg"}

我当前的正则表达式是：

/(a|ab)/g

当我有这样的文字时：

yeah abc

它将yeah中的“ a”替换为img1.jpg ，但还将“ ab” c替换为“ img1.jpg”。

我可以通过切换/(ab|a)/来避免这种情况，但这不是解决方案，因为我有一个巨大的未排序json列表作为表达式（a，ab只是为了简单起见）。我这样做的原因是用图像替换了原生表情符号。

我怎么说，只有后面没有b时才替换a？

Answer 1

按降序排列表情符号键，然后按如下所示构建您的正则表达式模式：

function replaceEmojis (str) {
  const emojis = {
    a: { src: 'imgA.jpg', color: 'red' },
    abc: { src: 'imgABC.jpg', color: 'green' },
    ab: { src: 'imgAB.jpg', color: 'blue' },
    bc: { src: 'imgBC.jpg', color: 'orange' }
  };
  
  const fnDescendingOrder = ([x, y]) => x > y ? -1 : +(x != y);

  const keys = Object.keys(emojis).sort((x, y) =>
    fnDescendingOrder(x.length == y.length ? [x, y] : [x.length, y.length])
  );

  const pattern = new RegExp(keys.join('|'), 'g');

  const transformed = str.replace(pattern, m => {
    const emoji = emojis[m];
    return '<img class="' + emoji.color + '" src="' + emoji.src + '">';
  });

  return transformed;
};

let str = 'yeah abc ab a abca bcaba';
result.innerHTML = replaceEmojis(str);

img { width: 10px; height: 100%; }
img.red { background: red; }
img.green { background: green; }
img.blue { background: blue; }
img.orange { background: orange; }

<div id="result"></div>

您必须先按长度降序排序，然后再按字母顺序排序。原因bc应该在abc之后检查。

正则表达式用img替换字符串-js

1 个答案: