从字符串中解析 RegEx 数组答案

【问题标题】：Parse an array of RegEx from string从字符串中解析 RegEx 数组
【发布时间】：2020-01-21 14:38:26
【问题描述】：

我有一个使用 masked-input 反应的组件。该组件使用 RegEx 数组来工作：


import React from 'react'
import MaskedInput from 'react-text-mask'

export default () => (
  <div>
    <MaskedInput
      mask={['(', /[1-9]/, /\d/, /\d/, ')', ' ', /\d/, /\d/, /\d/, '-', /\d/, /\d/, /\d/, /\d/]}
    />
  </div>
)

我从远程 API 获取掩码值，掩码以字符串形式出现：

var mask = '[/d/, /d/, " / ", /d/, /d/, " / ", /d/, /d/, /d/, /d/]'

如何将此字符串转换为有效的正则表达式和字符串数组？

来自

var mask = '[/d/, /d/, " / ", /d/, /d/, " / ", /d/, /d/, /d/, /d/]'

到

var mask = [/d/, /d/, " / ", /d/, /d/, " / ", /d/, /d/, /d/, /d/]

【问题讨论】：

你有远程服务器的控制权吗？一种更简单的方法是修改服务器以返回所有字符串，然后 JSON.parse 结果。
@Marie JSON 不知道什么是正则表达式，因此解析它不会产生正则表达式对象。
@VLAZ 这就是为什么我说如果服务器有控制权就让服务器返回所有字符串。然后您可以JSON.parse(mask).map(s => new RegExp(s)) 并继续前进，无需破解/手动解析。
@Marie 但" / " -> " / "，而不是/ \/ /
这两个是一回事。 / \/ /.test(" / ") === new RegExp(" / ").test(" / ") // true。无论哪种方式，OP是否控制服务器都没有关系，他们可以调整工作。这就是我问这个的原因。

标签： javascript arrays regex

【解决方案1】：

您可以对字符串进行切片，然后将其转换为数组，然后使用new RegExp 将每个元素转换为正则表达式：

var mask = '[/d/, /d/, " / ", /d/, /d/, " / ", /d/, /d/, /d/, /d/]';

const arrayRegex = mask.slice(1, mask.length - 1).split(",").map(reg => new RegExp(reg.trim()));



console.log(arrayRegex);

【讨论】：

" / " 应该是一个文字字符串，而不是这个值的正则表达式。此外，/d/ 可能不应该包含 / 符号，因为它们表示正则表达式文字（以及正则表达式的其他符号）。
@VLAZ 当正则表达式是文字时，区分文字字符串和正则表达式是否有意义？
@Marie 两者绝不相似，所以我不确定问题是什么。根据OP，字符串应该是字符串，而正则表达式应该是正则表达式。除非问题中的信息不正确，否则我不明白您为什么要为文字 " / " 生成正则表达式。

【解决方案2】：

您可以尝试为每个项目创建一个循环并将它们放入RegExp 类：

var mask = '[/d/, /d/, " / ", /d/, /d/, " / ", /d/, /d/, /d/, /d/]';

mask = mask.substring(1, mask.length - 1);

var patterns = [];

for (var pattern of mask.split(',')) {
  pattern = pattern.trim().replace(/(^\/)|(\/$)|(^")|("$)/g, '');
  
  patterns.push(new RegExp(`${pattern}`));
}

console.log(patterns);
console.log(patterns[0].test('d'));

如果您想将包含" / " 的项目保留为字符串，而不是正则表达式模式。在循环中，您可以将其编辑为：

for (var pattern of mask.split(',')) {
  pattern = pattern.trim().replace(/(^\/)|(\/$)/g, '');

  patterns.push(/^".+"$/.test(pattern) ? pattern.replace(/"/g, '') : new RegExp(`${pattern}`));
}

【讨论】：

不应该" / " 产生一个字符串 而不是正则表达式/ \/ /？

【解决方案3】：

由于您的字符串包含括号，因此将字符串转换为正则表达式数组的最简单方法是：

var arr = eval(mask);

然后您可以通过这种方式测试您的价值观：

arr[0].test('d')
true
arr[0].test('e')
false

此方法会将您的“/”条目保留为字符串。

【讨论】：