惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

U
Unit 42
N
News and Events Feed by Topic
S
Schneier on Security
G
GRAHAM CLULEY
Scott Helme
Scott Helme
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
GbyAI
GbyAI
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
C
CERT Recently Published Vulnerability Notes
T
The Exploit Database - CXSecurity.com
C
Cisco Blogs
T
The Blog of Author Tim Ferriss
Cisco Talos Blog
Cisco Talos Blog
P
Privacy & Cybersecurity Law Blog
K
KPMG report finds enterprise disconnect between AI and its ROI | CIO
博客园 - 司徒正美
Blog — PlanetScale
Blog — PlanetScale
Project Zero
Project Zero
MyScale Blog
MyScale Blog
Recent Commits to openclaw:main
Recent Commits to openclaw:main
Apple Machine Learning Research
Apple Machine Learning Research
小众软件
小众软件
The Last Watchdog
The Last Watchdog
Vercel News
Vercel News
The Cloudflare Blog
C
Check Point Blog
Help Net Security
Help Net Security
Microsoft Security Blog
Microsoft Security Blog
AI
AI
Simon Willison's Weblog
Simon Willison's Weblog
云风的 BLOG
云风的 BLOG
M
MIT News - Artificial intelligence
Stack Overflow Blog
Stack Overflow Blog
腾讯CDC
NISL@THU
NISL@THU
S
Security @ Cisco Blogs
CTFtime.org: upcoming CTF events
CTFtime.org: upcoming CTF events
S
SegmentFault 最新的问题
MongoDB | Blog
MongoDB | Blog
C
CXSECURITY Database RSS Feed - CXSecurity.com
T
Threatpost
AWS News Blog
AWS News Blog
Cloudbric
Cloudbric
N
News and Events Feed by Topic
PCI Perspectives
PCI Perspectives
S
Securelist
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
V
Vulnerabilities – Threatpost
S
Secure Thoughts

博客园 - 唯知为之

Antigravity Skills 全局安装与配置指南 前端设计资源汇总 VitePress 添加友链界面 如何快速无缝的从 vscode 转向AI编辑器 cursor、kiro、trae 等 VitePress 集成 Twikoo 评论 Vitepress 建站资源汇总 Vue3.5常用特性整理 巧用mask属性创建一个纯CSS图标库 给网站设置三级域名 vue3项目部署到Github 常用TS总结 定制你的清爽Mac版Edge浏览器 uni-app+vue3会遇到哪些问题 你想要的龙年特效来了 uni-app+vue3+ts项目搭建完整流程 vue3+ts打开echarts的正确方式 Vite4+Typescript+Vue3+Pinia 从零搭建(7) - request封装 Github项目徽标 Vite4+Typescript+Vue3+Pinia 从零搭建(6) - 状态管理pina
JS脚本批量处理TS数据类型
唯知为之 · 2024-08-26 · via 博客园 - 唯知为之

在TS开发中,经常会遇到后台数据字段比较多的情况,这时候需要一个个复制字段然后给他手动配置数据类型来完成我们的TS类型定义,相当麻烦。有什么快速的方法呢,我就目前遇到的两种情况分别写了JS脚本来处理后台数据,直接生成我们需要的数据格式。

脚本编写

1. 处理数据字典中的数据

一般数据字典表里的数据可能在excel文件里,也可能是在在线网页中,但它一般都是一个表格的形式,比如以下这种:
image

我们只需要复制前两列的内容,字段和字段类型。
明白我们的需求后,开始编写js脚本:

// 定义一个方法
const dealDictionaryKey = (string) => {
  // 复制出来的数据是多行的形式,所以我们以'\n'去分开每一行数据
  const strArr = string.split('\n');
  let newString = '';
  // 遍历每行数据
  for (let item of strArr) {
    // 空白行跳过
    if (item.trim() === '') continue;
    // 替换常用的后台数据类型为js类型,如果有遗漏请自行添加 /t是单元格字段和单元格类型之间的隔离符号
    item = item.replace(/\t/, ': ').replace('INTEGER', 'number').replace(/TIMESTAMP|DATE/, 'Date')
        .replace(/TEXT|VARCHAR\(\d*\)|CHAR\(\d*\)/, 'string');
    // 递归是因为可能一个字段里有多个下划线
    item = toUppercase(item);
    newString += item + ';\n';
  }
  console.log(newString)
}
// 递归字符串,替换字符串中每一个 下划线+小写字母 为 大写字母 的形式
const toUppercase = (str) => {
    const idx = str.indexOf('_');
    // 替换到没有下划线为止
    if(idx === -1) return str;
    // 下划线+小写字母
    const oldStr = str.substr(idx, 2);
    // 生成的大写字母
    const initial = str.substr(idx + 1, 1).toUpperCase();
    // 替换
    str = str.replace(oldStr, initial);
    str = toUppercase(str);
    return str;
}
// 赋值测试
const str =
`
department_id	INTEGER
department_name	VARCHAR(125)
department_type	CHAR(1)
	
	
create_user	VARCHAR(25)
create_time	TIMESTAMP
update_user	VARCHAR(20)
update_time	TIMESTAMP

`
// 执行
dealDictionaryKey(str);

执行结果

departmentId: number;
departmentName: string;
departmentType: string;
createUser: string;
createTime: Date;
updateUser: string;
updateTime: Date;

2. 处理后台代码中复制的数据

我们直接查看后台代码,然后复制出来进行处理。后台代码一般形式如下:
image

我们直接复制花括号中的内容,进行处理。js脚本编写如下:

// 定义一个方法
const dealServerKey = (str) => {
  // 复制出来的数据是多行的形式,所以我们以'\n'去分开每一行数据
  const strArr = str.split('\n')
  let newString = ''
  // 遍历每行数据
  for (let item of strArr) {
    // 空行跳过
    if (item.trim() === '' || item.indexOf('private') === -1) continue;
    // 删除无用的private字段
    item = item.replace('private', '').replace(';', '').trim();
    // 先将字段和类型分开
    const keys = item.split(' ');
    const type = keys[0].replace(/Integer|BigDecimal/, 'number').replace('String', 'string')
    // 处理后调换位置
    newString += keys[1] + ': ' + type + ';\n';
  }
  console.log(newString)
}
// 输入测试
const str =  `
    private Integer departmentId;

    private String departmentName;

    private String departmentType;

    private String departmentTypeName;

    private Date createTime;
`
// 执行
dealServerKey(str);

执行结果

departmentId: number;
departmentName: string;
departmentType: string;
departmentTypeName: string;
createTime: Date;

使用

脚本编写后,当然可以在浏览器控制台直接使用,每次的输入内容和调用执行需要手动替换。不过这样使用不太直观方便,我这边一般都会使用 在线的执行js工具,百度谷歌一搜很多。
以下以我使用的 run-js 为例:
image

将脚本复制到左侧代码框内,然后每次去替换 str 的赋值,点击中间的 执行 按钮,结果即可在右侧展示。
最后复制右侧内容到代码里即可。