前言
上一期我发了一篇文章：# 我写了个工具，让CRUD开发效率提升100倍
第一次上了热门，非常感谢大家哈
项目github地址：github.com/GooseCoding…
工具地址：utilsbox.cn/
顺手点个星星呗，后面还会把这个项目其他工具陆续开源出来，敬请期待～
最初的计划是核心生成代码的部分使用Java来写，前端负责展示。
但考虑到使用Java写，得部署一份后端服务，用户每次生成代码，都要占用部分服务器资源，所以就直接在前端用JavaScript实现了。
其实现在ES6之后，语法上和Java很相似的，Java后端的同学应该也能看得懂代码。
先管理下大家的预期哈。
生成代码看起来挺有意思的，但是实现起来真的不难。
由于主语言是Java，写前端也有很浓的后端味儿。。
为了追求开发效率，很多地方并没有使用非常规范的方式来写，也请各位朋友们多多包涵啦。
设计
动态参数
顾名思义，就是会“动”的参数。
动态参数是给用户定义代码模版时使用的。
用户填写的表名、字段信息等等值，都会和动态参数进行对应。
每一个动态参数，都明确定义了它会输出什么内容。
在生成代码的时候，代码模版里的动态参数code会替换成这个动态参数对应的内容。
全部的动态参数，请参阅这篇文章：# 我写了个工具，让CRUD开发效率提升100倍
上图中，红框标记的地方，就是动态参数，它们以$符号前后包裹的方式，出现在代码模版中。
具体是怎么实现的？
动态参数在代码中的具体实现，就是替换器（Replacer） ，每一个动态参数，都有一个与之对应的替换器。
替换器有3个明确的职责：
- 生成动态参数对应的内容
- 执行替换动作
- 返回替换完成的内容。
这些替换器，目前全都写在在一个replacerAdapter对象之中，方便后续根据动态参数的code，适配对应的替换器。
/** 根据动态参数，匹配替换器（Replacer）*/
const replacerAdapter = {
/**
* 原始表名 $table_name$
* @param {ReplacerRequest} parameter
* @returns 替换后的代码内容
*/
table_name: (parameter) => {
return parameter.content.replaceAll(`$table_name$`, parameter.tableInfo.tableName);
},
/**
* 表名驼峰首字母小写 $table_name_hump$
* @param {ReplacerRequest} parameter
* @returns 替换后的代码内容
*/
table_name_hump: (parameter) => {
let table_name_hump = letterUtils.underlineToHump(parameter.tableInfo.tableName);
return parameter.content.replaceAll(`$table_name_hump$`, table_name_hump);
},
......
}
成员代码块
常规的动态参数，都是根据用户填写的表信息，来直接映射或者进行一些特殊处理后，生成的替换内容
但有些场景，需要根据表中字段的数量，动态生成N份相同模版的代码块，例如实体类的成员属性列表，GetSet方法列表等等。并且这些代码块内容，可以交给用户自行定义。
所以这一类动态参数，我给它取名叫做成员代码块（叫动态代码块也行）。
它有以下特性：
1、会根据表的字段数量，生成对应份数的代码块内容。
2、代码块的内容，由用户自定义，并且允许使用动态参数。
3、由于允许使用动态参数，替换器在生成替换内容时，需要把代码当中的动态参数，替换成对应的内容。还需要根据字段数量，生成N份代码块，然后拼接起来。
例如 成员变量列表 这个动态参数 $member_param_list$
表中有三个字段：id(主键)、goods_name、price
假设用户定义了如下代码块内容：
/** $field_comment$ */
private $field_type_java$ $field_name_hump$;
执行完成后，会输出：
/** id */
private Integer id;
/** 商品名称 */
private String goodsName;
/** 商品价格 */
private String price;
全部的动态参数-成员代码块，请参考：# 我写了个工具，让CRUD开发效率提升100倍
代码模版
代码模版由用户自行定义，它由主体代码 + N个成员代码块组成（N可以是0）。不论是主体代码，还是成员代码块，都支持在代码当中的关键位置，插入动态参数，从而形成一份代码模版。
/** 模版内容信息 */
interface CodeTemplate {
/** 代码模版编码 */
code: string;
/** 代码模版名称 */
title: string;
/** 代码内容 */
bodyCode: string;
/** 成员代码块列表 */
memberCode: [{
/** 成员代码模版编码（对应一个动态参数） */
code: string;
/** 成员代码模版名称 */
title: string;
/** 代码内容 */
bodyCode: string
}];
}
匹配替换
有了动态参数和代码模版这两个基础，匹配替换就很好理解了
当用户填写完成表的信息，点击【生成代码】时，把代码模版当中包含的动态参数找出来，通过动态参数的code获得对应的替换器（Replacer） ，替换器会生成这个动态参数对应的内容，然后匹配和替换掉代码模版当中这个动态参数。当代码模版中所有的动态参数都替换完成，代码也就生成好了。。
图解
代码从何看起
关键代码在这俩文件里：
代码都写了很详细的注释，而且真的也不复杂，就不在这里浪费篇幅讲解啦，大家直接pull下来看即可。
怎么跑起来？
1、安装npm，版本用最新的好了，网上很多教程，参考一下
2、使用 vs code 打开项目文件
3、使用 npm install安装依赖的第三方库，再npm run start项目就跑起来了