懂前端的你也可以轻松定义自己业务的DSL

一个JavaScript版本的bison

jison是一个 JavaScript 编写的解析器生成器，可以用来生成自定义的编程语言解析器。它的令人兴奋的点在于，它允许开发人员使用 JavaScript 语言来定义语法规则，然后将其转换为解析器，从而支持自定义的编程语言。

在前端应用方面，Jison 可以用于实现自定义的模版引擎，例如类似于 Handlebars 或者 Mustache 的模版引擎。通过使用 Jison，开发人员可以定义自己的模版语法规则，然后将其转换为解析器，从而实现对自定义模版语法的支持。

此外，Jison 还可以用于实现自定义的 DSL（领域特定语言），例如在前端应用中实现一些特定的业务逻辑，例如表单验证、数据格式化等等。通过使用 Jison，开发人员可以定义自己的 DSL 语法规则，然后将其转换为解析器，从而实现对自定义 DSL 的支持。

jison有很多demo可以供参考，比如 写一个计算器 https://gerhobbelt.github.io/jison/try/

demo

要实现这个计算器，你的代码不再是手写解析算术表达式，手写语法树解析，然后计算结果，而是只用定义规则，剩下的事让机器帮你搞定就好了：

cala.bison

/* description: Parses end executes mathematical expressions. */

/* lexical grammar */
%lex
%%

\s+                   /* skip whitespace */
[0-9]+("."[0-9]+)?\b  return 'NUMBER'
"*"                   return '*'
"/"                   return '/'
"-"                   return '-'
"+"                   return '+'
"^"                   return '^'
"("                   return '('
")"                   return ')'
"PI"                  return 'PI'
"E"                   return 'E'
<<EOF>>               return 'EOF'
.                     return 'INVALID'

/lex

/* operator associations and precedence */

%left '+' '-'
%left '*' '/'
%left '^'
%left UMINUS

%start expressions

%% /* language grammar */

expressions
    : e EOF
        {return $1;}
    ;

e
    : e '+' e
        {$$ = $1+$3;}
    | e '-' e
        {$$ = $1-$3;}
    | e '*' e
        {$$ = $1*$3;}
    | e '/' e
        {$$ = $1/$3;}
    | e '^' e
        {$$ = Math.pow($1, $3);}
    | '-' e %prec UMINUS
        {$$ = -$2;}
    | '(' e ')'
        {$$ = $2;}
    | NUMBER
        {$$ = Number(yytext);}
    | E
        {$$ = Math.E;}
    | PI
        {$$ = Math.PI;}
    ;

要了解jison的强大，就必须了解下DSL，以及它能够高效的解决哪些问题：

DSL（Domain-Specific Language）是一种用于特定领域的编程语言，它是为了解决某些领域特定的问题而设计的。与通用编程语言相比，DSL更加专注于特定领域，因此在该领域内更易于使用和理解。DSL可以通过语法、关键字或标记等方式来描述特定领域内的问题，并提供相应的解决方案。常见的DSL包括配置文件语言、领域特定脚本语言、数据流语言等。DSL的好处在于可以提高编程效率和代码可读性，同时也使得非程序员能够更容易地理解和维护代码。

简单的实现一个DSL的步骤

要完整实现一个DSL，需要以下步骤：

1.定义DSL的语法和语义：DSL语言需要有自己的语法和语义，以便用户能够使用该语言来表达自己的意图。语法定义通常使用BNF或EBNF表示。

2.实现DSL的解析器：DSL解析器是将DSL代码解析为计算机可执行的指令的程序。解析器通常使用词法分析器和语法分析器来实现。

3.实现DSL的执行器：DSL执行器是将DSL代码转化为实际的计算机操作的程序。执行器通常使用解释器或编译器实现。

其中词法分析器，语法分析器这些都有非常稳定的工具，比如，如果有定义好的BNF范式，直接丢给 flex 就可以解决词法分析的这个过程，然后在丢给 yacc，就可以按照这个规则编译出可执行程序，也许你会觉得这个非常不可思议，怎么写一堆规则就可以变成可执行程序呢？但实际上，你好好思考下，你写程序部也是在规定一些规则吗？

if/else/while/... ，这部都是在告诉计算机如何理解并执行你的意图吗？OK，立即这些，就看看其中的一些概念，对于新手可能需要科普一下：

BNF或EBNF简单的描述

BNF（巴克斯-诺尔范式）和 EBNF（扩展巴克斯-诺尔范式）是一种用于描述编程语言结构的形式语法。例如，下面是一个使用BNF表示的简单数学表达式：

<expr> ::= <term> | <expr> "+" <term> | <expr> "-" <term>
<term> ::= <factor> | <term> "*" <factor> | <term> "/" <factor>
<factor> ::= <number> | "(" <expr> ")"

这个BNF描述了一个数学表达式可以由一个项(term)或一个表达式(expr)加减一个项(term)组成。一个项可以由一个因子(factor)或一个项(term)乘除一个因子(factor)组成。一个因子可以是一个数字(number)或者一个表达式(expr)。

EBNF是BNF的一个扩展，添加了更多的元素来描述更复杂的语言结构。例如，下面是一个使用EBNF描述的简单的JSON对象：

<object> ::= "{" <property> {"," <property>} "}"
<property> ::= <string> ":" <value>
<string> ::= '"' {<char>} '"' 
<value> ::= <string> | <number> | <object> | <array> | "true" | "false" | "null"
<number> ::= {<digit>} ["." {<digit>}] ["e" [<sign>] {<digit>}]

这个EBNF描述了一个JSON对象由大括号包围着若干个属性(property)组成。每个属性包含一个字符串键(string)和一个值(value)，用冒号分隔。字符串是由双引号包围的任意字符的序列(char)。值可以是一个字符串，一个数字，一个JSON对象，一个JSON数组，或者true/false/null中的一个。数字是由一个或多个数字(digit)和一个可选的小数点以及一个可选的指数部分组成。

上面这一堆精准定义的规则都是一些上下文无关文法，要准确写出flex可以用的规则，必须对上下文无关文法比较熟悉，比如不能出现左递归、不能出现空规则等等：

上下文无关文法

上下文无关文法（Context-Free Grammar）指的是一种形式文法，其中所有规则的左部只包含一个非终结符号，而右部可以是任意长度的终结符和非终结符序列。上下文无关文法是自然语言处理、编译原理和计算机语言设计等领域中广泛使用的一种形式化表示方法。

要轻松写一个上下文无关文法，可以按照以下步骤进行：

• 1. 确定终结符号集和非终结符号集。终结符号是指语言中的基本符号，如字母、数字、标点符号等；非终结符号是指可以被分解为其他符号序列的符号，如句子、短语、单词等。
• 2. 编写规则。规则由两部分组成，左部为非终结符号，右部为终结符号和/或非终结符号的序列。例如，一个简单的规则可以写为：S -> aSb，表示S可以被替换为一个'a'，后面跟着S，再后面跟着一个'b'。
• 3. 定义起始符号。起始符号是文法中唯一的一个非终结符号，表示整个文法的起点。通常用大写字母来表示起始符号。
• 4. 检查文法的合法性。文法需要满足一些条件，如不能存在左递归、不能出现空规则等。

例如，一个简单的上下文无关文法可以表示一个简单的算术表达式：

1. 终结符号集：数字（0-9）、加号（+）、减号（-）、左括号（(）、右括号（)）

2. 非终结符号集：表达式（E）、项（T）、因子（F）

3. 规则：

   E -> E+T | E-T | T
   T -> T*F | T/F | F
   F -> (E) | num

4. 起始符号：E

这个文法可以生成类似于“3+4*5”的算术表达式。

左递归和空规则

左递归：在一个产生式的右部出现了该产生式本身作为左部的情况，例如：A->Aα（α为任意串）。这种产生式会导致递归调用，容易陷入死循环，因此需要消除左递归。

空规则：也称ε规则，表示产生式右部可以为空，例如：A->ε。如果某个非终结符的所有产生式都是空规则，那么这个非终结符可以被省略，也就没有必要存在了。但是，如果存在空规则，那么在语法分析时需要进行特殊处理，增加算法的复杂度。因此，尽量避免使用空规则。

DSL擅长解决哪些领域的问题

DSL（领域特定语言）擅长解决领域特定问题，即在特定领域中使用的编程语言。以下是一些DSL可以解决的问题的例子：

• 1. SQL：SQL是一种DSL，用于在关系数据库中查询和操作数据。它是用于数据管理和查询的最常用的DSL之一。
• 2. HTML和CSS：HTML和CSS是用于构建Web页面的DSL。HTML用于定义页面的结构和内容，CSS用于定义页面的外观和样式。
• 3. LaTeX：LaTeX是一种DSL，用于创建高质量的科学文档和出版物。它提供了丰富的排版控制，使得用户可以创建复杂的数学公式，图表和图形。
• 4. R：R是一种DSL，用于数据分析和统计。它提供了许多内置函数和库，可以用于数据可视化，机器学习和预测建模等任务。
• 5. Regex：正则表达式是一种DSL，用于匹配和操作文本。它在许多编程语言中都得到了广泛的应用，可以用于文本搜索，替换和解析。

DSL可以用于在特定领域中更有效地解决问题，提高开发效率和代码质量。