正则表达式“AND OR”表示[left | right] || [top |底部]

Question

我想写一个正则表达式将匹配以下YACC表达： [left | right] || [top | bottom]：

它应符合：（左或右）和OR（顶部或底部）。 OR'|'很简单，但'||'我无法弄清楚。 该表达式是由W3C定义的CSS梯度语法的一部分：

<linear-gradient> = linear-gradient(
    [ [ <angle> | to <side-or-corner> ] ,]? 
    <color-stop>[, <color-stop>]+ 
) 

<side-or-corner> = [left | right] || [top | bottom] 

编辑： ，并提供：左顶 匹配：左顶

给予：左 匹配：左

给予：右下角 配对：右下角

给：右20px 匹配：对

希望这解释得更好。 谢谢

Answer 1

如果我理解正确的，你想要么侧（左/右/上/下）或角落（左上角，右下角 ...）。
这是可以解决的，就像这样：

/^((left|right|top|bottom)|((top|bottom)delimiter(left|right)))$/ 

就可以了，当然，扭转双方的顺序拐角符号（输出拐角左上而不是左上） ：

/^((left|right|top|bottom)|((left|right)delimiter(top|bottom)))$/ 

请注意，分隔符是您想要的分隔符（可以是空格或减号）。
希望这有助于！

P.S. ：我在Twitter上听到您的求助电话：P。

更新
根据您的修改，我觉得现在我明白你需要什么：

/^((left|right|top|bottom)|((left|right|(-?\d*(\.\d+)?(px|em|\%)))\s+(top|bottom|(-?\d*(\.\d+)?(px|em|\%)))))$/ 

此正则表达式现在的一侧（左/上/右/底部）或双方一致由左侧&顶部值定义，其可以是方向关键字（左侧/顶部/右侧/底部）或实际值（例如100px或1.4em）。
值的正则表达式（）任何浮点数（甚至不用加0：.123代替0.123）匹配，然后测量单位（在这里你可以提供的单位的完整列表）

下面是一些我的（的JavaScript）测试，其通过：

var pattern = /^((left|right|top|bottom)|((left|right|(-?\d*(\.\d+)?(px|em|\%)))\s+(top|bottom|(-?\d*(\.\d+)?(px|em|\%)))))$/; 
pattern.test('left bottom'); // true 
pattern.test('-10px top');  // true 
pattern.test('-.23em 140%'); // true 

最终更新

• 除去开始&结束字符
• 切换侧面和角图案的顺序，优先的角图案，以匹配第一

/(((left|right|(-?\d*(\.\d+)?(px|em|\%)))\s+(top|bottom|(-?\d*(\.\d+)?(px|em|\%))))|(left|right|top|bottom))/

Answer 2

/(left|right)|(top|bottom)|(left|right)\s(top|bottom)/ 

应该做的任务。你可能会缩短到

/(left|right|top|bottom)|(left|right)\s(top|bottom)/ 

或

/(left|right)|((left|right)\s)?(top|bottom)/