【Ctool】【03-常量查看器】winerror.h

导读

本系列实现自制开发工具，提高开发效率。
作为windows开发人员，经常需要查看windows api的返回值，也就是winerror.h中的定义。为了方便定位该错误信息，我们可以通过VS提供的工具errlook.exe（D:\Program Files (x86)\Microsoft Visual Studio\2019\Professional\Common7\Tools\errlook.exe）进行查看，效果如下图：

但是该工具不能通过宏定义查找错误描述，相对来说有一定的限制。

今天我们就通过前端，手动撸一个查看器，效果如下：

- - - -系列文章- - - -

• 【高效】最强开发工具Ctool编译踩坑
• 【Ctool】【01-功能扩展】新建新的分类和子工具页面
• 【Ctool】【03-常量查看器】winerror.h

ps: python安装后自带了winerror.py，对winerror.h文件进行了解析，但好像解析错了，没达到想要的效果。

开发环境

	版本号	描述
操作系统	Win11-21H2	内部版本号22000.588
node -v	v12.18.3
npm -v	6.14.6

根据winerror.h生成原始数据

先上个测试数据效果图：

RegExp.exec正则表达式编写

//
// MessageId: ERROR_SUCCESS
//
// MessageText:
//
// The operation completed successfully.
//
#define ERROR_SUCCESS                    0L

#define NO_ERROR 0L                                                 // dderror
#define SEC_E_OK                         ((HRESULT)0x00000000L)

//
// MessageId: ERROR_INVALID_FUNCTION
//
// MessageText:
//
// Incorrect function.
//
#define ERROR_INVALID_FUNCTION           1L    // dderror

//
// MessageId: ERROR_FILE_NOT_FOUND
//
// MessageText:
//
// The system cannot find the file specified.
//
#define ERROR_FILE_NOT_FOUND             2L

如上图所示，我们通过正则获取上述三个值

• 错误码的描述desc：.*
• 错误码的定义k：\S+（大写的S）
• 错误码的值v：\d+
• k和v之间的多个空格：\s+（小写的s）

codeGenJson.vue添加按钮和处理函数winError()

<Button type="primary" @click="handle()">{{ $t('allMy_convert') }}</Button>

正则循环匹配结果并输出为数组

winError() {
  var objJson = [];
  //   // (.*)\n//\n#define (\S+)\s+(\d+)L/g
  var r = /\/\/ (.*)\n\/\/\n#define (\S+)\s+(\d+)L/g;
  var a = null;
  while ((a = r.exec(this.current.input))) {  //循环执行匹配操作
    var [_, desc, k, v] = a;
    objJson.push({desc: desc, k: k, v: v});
  }
  this.current.output = JSON.stringify(objJson);
  console.log(Object.keys(objJson).length);
}

exec() 方法用于检索字符串中的正则表达式的匹配。

该函数返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。

循环调用exec() ，将逐个取出匹配到的结果。

根据原始数据提供winerror常量查找功能

搭建新的工具页面

参考文章 【Ctool】【01-功能扩展】新建新的分类和子工具页面即可。

初始化数据

this.winerror是上一步中的原始数据数组。通过map，变量所有数据，根据k和v重新构造一个Map对象this.kMaps，加快后续查询速度。

    created() {
        this.$initToolData('input');

        // 将winerror等表转换为多种k,v
        this.winerror.map(item => {
          var {desc, k, v} = item;
          var hex = '0x'+Number(v).toString(16);
          item.hex = hex;
          this.kMaps[k] = item;
          this.kMaps[v] = item;
        });
    },

数据查找展示

代码很简单，从this.kMaps中获取item，然后赋值给this.current.output，该值绑定了响应的input元素。

handle() {
    var item = this.kMaps[this.current.input.trim()];
   console.log(item)
   if (item) {
     this.current.output = item;
   }
},

支持0x、0X、H、h、L、l

handle()函数改进：

 handle() {
    var input = this.current.input.trim();
    // 支持后缀H、h、L、l
     if (input.endsWith('H') || input.endsWith('h')) {
       input = '0x' + input.slice(0, -1);
     } else if (input.endsWith('L') || input.endsWith('l')) {
       input = input.slice(0, -1);
     }

    var item = null;
    // 不是数字
    if (isNaN(Number(input))) {
      item = this.kMaps[input];
    } else {
      // 转为数字，然后转为字符串
      item = this.kMaps[Number(input) + ''];
    }
    console.log(item)
    if (item) {
      this.current.output = item;
    }
 },

文章小结

整个过程并不复杂，只要思路对了，就剩下写代码的事情了，适合新手练手。
主要涉及下面知识点：

• vue基础。
• 正则RegExp.exec、结果迭代（match不能处理Group结果）。
• 数组的map函数使用。
• Number对象处理字符转数字（一开始想用eval的，需要额外处理异常，所以推荐使用Number对象）。
  

ps：正则是个好东西，把复杂的字符处理简单化，更能方便维护。

参考资料

• 正则表达式图形化工具 https://jex.im/regulex
• 正则表达式在线工具 https://khz.gitee.io/Ctool/tool.html#/tool/regex
• 小编的gitee在线使用地址： https://khz.gitee.io/Ctool/tool.html
• 小编gitee地址：https://gitee.com/yeahmao/front_end__ctool
• qq群：夜猫逐梦技术交流裙/953949723