1.本说明书实施例涉及计算机代码编写技术领域,特别涉及一种代码转换方法。
背景技术:2.随着互联网技术的发展,针对多种项目场景的互联网产品层出不穷。针对简单的项目场景,利用特定格式的低代码(lowcode)即可进行开发应用,低代码因为其可视化、易操作的特点,以较少的代码和较快的速度就能完成开发应用的任务。然而,针对高复杂度的项目场景,在项目场景变化时需要对低代码协议进行编写,使得低代码的适用性不足,导致互联网产品的可维护性不足,而专业代码(procode)可以直接对项目场景进行编写,使用专业代码进行开发应用,可以使后期对互联网产品进行维护更为方便,提升互联网产品的稳定性。
3.目前,将低代码转换为专业代码,由于低代码不具有底层内容,只需要通过两者间代码层级的对应关系直接进行转换。
4.然而,专业代码包含低代码中不具有的底层内容,无法通过简单的对应关系直接将专业代码转换为低代码。因此,亟需一种高适应性的代码转换方法。
技术实现要素:5.有鉴于此,本说明书实施例提供了一种代码转换方法。本说明书一个或者实施例同时涉及一种代码转换装置,一种计算设备,一种计算机可读存储介质以及一种计算机程序,以解决现有技术中存在的技术缺陷。
6.根据本说明书实施例的第一方面,提供了一种代码转换方法,包括:
7.获取源代码;
8.从源代码中识别组件标签;
9.根据组件标签,生成代码导入信息;
10.对源代码和代码导入信息进行拼装,得到拼装代码;
11.调用预设的代码解析器,执行目标组件生成函数对拼装代码进行解析,生成特定格式的目标代码。
12.根据本说明书实施例的第二方面,提供了一种代码转换装置,包括:
13.源代码获取模块,被配置为获取源代码;
14.组件标签识别模块,被配置为从源代码中识别组件标签;
15.代码导入信息生成模块,被配置为根据组件标签,生成代码导入信息;
16.拼装模块,被配置为对源代码和代码导入信息进行拼装,得到拼装代码;
17.目标代码生成模块,被配置为调用预设的代码解析器,执行目标组件生成函数对拼装代码进行解析,生成特定格式的目标代码。
18.根据本说明书实施例的第三方面,提供了一种计算设备,包括:
19.存储器和处理器;
或“当
……
时”或“响应于确定”。
34.首先,对本说明书一个或实施例涉及的名词术语进行解释。
35.低代码(lowcode):一种数字技术工具编码,基于图形化拖拽、参数化配置等更为高效的方式,实现产品的开发应用。
36.低代码底层协议(lowcode schema):通过声明组件与属性参数,来描述视图结构及逻辑结构。
37.专业代码(procode):纯代码,在产品的开发应用中,为了实现特定功能,对应编写的代码。
38.jsx:是一种javascript的语法扩展,最终被渲染为html节点。
39.react:一种构建用户界面的javascript的框架,包括初始组件生成函数(react createlement)。
40.组件:通过对数据和方法的简单封装,构建得到的一个编程对象(object)。
41.目前,将低代码转换为专业代码的方式,具体为:遍历低代码中各组件,解析低代码中各组件,得到各组件的组件标签和组件属性参数,通过对应关系将低代码中的组件标签转换为专业代码中的组件标签,将低代码中的组件属性参数转换为专业代码中的组件属性接口,重复上述步骤直到完成对低代码中各组件的代码转换,得到专业代码。
42.以低代码底层协议(lowcode schema)转换为jsx代码为例,上述方法对应的实现代码如下所示:
43.解析各组件,得到各组件的组件标签和组件属性参数:
[0044][0045][0046]
通过对应关系将低代码中的组件标签转换为专业代码中的组件标签,将低代码中的组件属性参数转换为专业代码中的组件属性接口,直到完成对低代码中各组件的代码转
换:
[0047][0048]
目前,将专业代码转换为低代码的方式,具体为:对专业代码进行语法解析,构建专业代码的抽象语法树,遍历抽象语法树,得到多个语法节点的标签和属性参数,利用多个语法节点的标签和属性参数,将专业代码转换为低代码。
[0049]
然而这样的方法,需要先构建抽象语法树,再根据抽象语法树转译得到低代码,没有基于代码层级直接进行代码转换,引入了构建抽象语法树和抽象语法树转译得到低代码的中间步骤,对于抽象语法树的构建工具性能和抽象语法树的转译工具性能提出较高要求,容易出现遗漏和错误。为了解决遗漏和错误的问题,对应需要不断优化构建工具和转译工具的性能,并且需要开发分析工具对转换得到的低代码进行计算分析,确认是否出现遗漏和错误,增加了代码转换的成本,降低了代码转换的效率。
[0050]
针对上述问题,在本说明书中,提供了一种代码转换方法,本说明书同时涉及一种代码转换装置,一种计算设备,以及一种计算机可读存储介质,在下面的实施例中逐一进行详细说明。
[0051]
参见图1,图1示出了根据本说明书一个实施例提供的一种代码转换方法的流程图,具体包括以下步骤。
[0052]
步骤102:获取源代码。
[0053]
本说明书实施例应用于集成开发环境或者代码开发平台。
[0054]
源代码为面向对象编程的专业代码,例如,java、javascript、jsx、c++、c#、html、xml等。
[0055]
源代码中包括定义了多个组件的组件代码,组件为对应真实世界的某个具体事物或者软件中的特定元素,元素为网页开发语言(jsx、html、xml)中的对象内容,例如,网页中的一个输入框、网页中的一个按钮等。在本说明书实施例中组件和元素一致。
[0056]
获取源代码,具体方式为:接收开发者通过客户端上传的源代码,或者,调用代码数据库获取预先存储的源代码。
[0057]
示例性地,调用github的远程代码数据库,获取预先存储的源代码,源代码为:
[0058][0059]
通过获取源代码,为后续从中识别组件标签提供了数据,为后续进行代码转换奠定了基础。
[0060]
步骤104:从源代码中识别组件标签。
[0061]
组件标签为源代码中组件的对象名称,为字符串格式的代码。
[0062]
从源代码中识别组件标签,具体方式为:根据组件标签的字符串特征,从源代码中识别组件标签。
[0063]
识别的方法包括:预先根据组件标签的字符串特征,确定组件标签的命名规则;根据命名规则,构建组件标签列表;根据组件标签列表对源代码进行遍历,得到组件标签。
[0064]
识别的方法还包括:预先根据组件标签的字符串特征,训练神经网络模型,得到组件标签识别模型;利用组件标签识别模型,识别源代码,得到组件标签。
[0065]
识别的方法还包括:预先根据组件标签的字符传特征,设定正则表达式;利用正则表达式,识别源代码,得到组件标签。
[0066]
继续上述例子,根据组件标签的字符串特征:首字母大写,在“《”或“《/”字符之后,通过该字符传特征,对应构建训练样本,训练神经网络模型,得到组件标签识别模型,识别上述源代码,得到组件标签为“div”和“button”。
[0067]
通过从源代码中识别组件标签,为后续生成代码导入信息奠定了基础,同时准确对应到源代码中的组件代码,避免出现遗漏,提升了代码转换的准确度。
[0068]
步骤106:根据组件标签,生成代码导入信息。
[0069]
代码导入信息为将对象导入至代码解析器进行解析的导入信息。例如,创建对象“object1”和“object2”,生成了对象库objectlib,需要通过代码导入信息“import object1 from objectlib”,从对象库中将构建的对象导入,进行解析。
[0070]
根据组件标签,生成代码导入信息,具体方式为:根据组件标签,创建组件对象,再根据组件对象生成代码导入信息。
[0071]
示例性地,根据组件标签“div”和“button”,创建组件对象div和组件对象button,
根据组件对象div和组件对象button,生成代码导入信息:
[0072]
import div from“div”;
[0073]
import button from“button”;
[0074]
根据组件标签,生成代码导入信息,为后续拼装得到拼装代码奠定了信息基础,也为后续进行解析,奠定了组件对象的调用基础。
[0075]
步骤108:对源代码和代码导入信息进行拼装,得到拼装代码。
[0076]
对源代码和代码导入信息进行拼装,得到拼装代码,具体方法代码为:
[0077]
const newcontent=`import react from'react';//newcontent为拼装代码,importstr为代码导入信息,jsx为jsx的源代码//
[0078]
${importstr}
[0079]
${jsx}
[0080]
示例性地,对源代码和代码导入信息进行拼装,得到拼装代码:
[0081][0082][0083]
通过将源代码和代码导入信息进行拼装,得到拼装代码,为后续进行解析提供了解析对象。
[0084]
步骤110:调用预设的代码解析器,执行目标组件生成函数对拼装代码进行解析,生成特定格式的目标代码。
[0085]
目标代码为面向对象编程的低代码,目标代码为一种特定格式的可视化代码,例如,网页生成器、数据库构建器中的可拖拽模块,参数化配置等代码。特定格式为:对象1名称{对象1的属性参数;对象2名称{对象2的属性参数}}。
[0086]
目标组件生成函数是对源代码的初始组件生成函数进行调整,得到的函数。例如,源代码为javascript语言的代码,针对javascript语言的代码的初始组件生成函数为react createlement函数,react createlement函数根据源代码中的组件代码,生成对应的组件对象。通过对react createlement函数进行调整,得到目标组件生活函数injectreactmodule,执行injectreactmodule,解析得到源代码中的组件对象的属性参数,并传递至目标代码。
[0087]
代码解析器为预先对代码转换器进行调整,得到的可以对代码进行解析的代码解析器。代码转换器是预先根据源代码设定的,将源代码转换为机器语言的转换器。例如,对于javascript语言,babel为一种将javascript语言的代码转换为机器语言的代码转换器,
通过对babel进行调整,得到可以将javascript语言的代码(源代码)进行解析的代码解析器,通过调用代码解析器,解析javascript语言的代码得到对应的组件标签和属性参数。例如,javascript语言的代码为“var a=12”,通过代码解析器,解析得到变量名为“a”,变量的赋值为12。
[0088]
调用预设的代码解析器,执行目标组件生成函数对拼装代码进行解析,生成特定格式的目标代码,具体方式为:调用预设的代码解析器,执行目标组件生成函数对拼装代码进行解析,得到组件对象的组件标签和属性参数,并传递至目标代码,生成特定格式的目标代码。
[0089]
示例性地,根据babel代码转换器调整得到代码解析器compiler,根据初始组件生成函数react createlement调整得到目标组件生成函数injectreactmodule。调用代码解析器compiler,执行injectreactmodule解析拼装代码“import div from“div”;
[0090][0091]
得到源代码中的组件对象的属性参数“classname=“mydiv”和“按钮”,传递属性参数“classname=“mydiv”和“按钮”至目标代码,得到特定格式的目标代码:
[0092][0093]
本说明书实施例中,获取源代码,从源代码中识别组件标签,根据组件标签,生成代码导入信息,对源代码和代码导入信息进行拼装,得到拼装代码,调用预设的代码解析器,执行目标组件生成函数对拼装代码进行解析,生成特定格式的目标代码。根据源代码中的组件标签生成代码导入信息,再对源代码和代码导入信息进行拼装得到拼装代码,调用代码解析器,执行目标组件生成函数,可以基于组件生成时对拼装代码的解析和生成,进而根据代码层级的拼装代码直接进行代码转换,生成目标代码,避免了在代码转换过程中出现遗漏,提升了代码转换的适应度和准确度。
[0094]
可选地,步骤106包括如下具体步骤:
[0095]
根据组件标签,创建组件对象库;
[0096]
根据组件对象库,生成代码导入信息。
[0097]
组件对象库为多个创造的组件对象的封装库,其中的组件对象不是源代码中包含的,而是根据组件对象的组件标签创建得到的。创造的组件对象不包含组件对象的属性参数。
[0098]
进行后续的代码解析,需要有确定的对象,导入至代码解析器中,才能完成解析。初始组件生成函数是根据源代码生成组件对象,经过对初始组件生成函数的调整,得到目标组件生成函数,执行目标组件生成函数生成的组件对象,即为特定格式的目标代码,不是对应的组件对象。因为代码解析器需要有确定的对象才能进行解析,如果执行初始组件生成函数根据源代码直接生成组件对象,即无法得到目标代码。因此,需要根据组件标签创建
组件对象来进行后续的解析。
[0099]
根据组件标签,创建组件对象库,根据组件对象库,生成代码导入信息,具体方式为:根据多个组件标签,创建多个组件对象,将多个组件对象封装后得到组件对象库,根据组件对象库,生成代码导入信息。
[0100]
示例性地,根据组件标签“div”和“button”,创建组件对象fakediv和组件对象fakebutton,将组件对象fakediv和组件对象fakebutton封装后得到组件对象库fakecomponentlib,根据组件对象库fakecomponentlib,生成代码导入信息:
[0101]
import div from fakecomponentlib;
[0102]
import button from fakecomponentlib;
[0103]
根据组件标签,创建组件对象库,根据组件对象库,生成代码导入信息。通过组件标签对应创造组件对象库,可以准确地对源代码进行代码转换,避免了代码转换中出现遗漏和错误,提升了代码转换的准确度,并且生成代码导入信息,为后续进行解析提供了解析对象条件,保证了后续解析的顺利执行。
[0104]
可选地,根据组件标签,创建组件对象库,包括如下具体步骤:
[0105]
将各组件标签分别设置为对应组件的属性参数,得到多个组件对象;
[0106]
根据多个组件对象,构建组件对象库。
[0107]
组件对象为对应真实世界的某个具体事物构建的代码对象。
[0108]
组件的属性参数为组件的运行逻辑、功能方法、样式等属性参数。例如,组件为按钮组件,按钮组件的运行逻辑为:识别到前端的点击操作后,执行对按钮设定的“登录”功能,按钮的样式为:{矩形框,字体:宋体,字号:四号,文字颜色:黑色,填充颜色:白色}。
[0109]
因为在根据组件标签,构建的组件对象库,还未对拼装代码进行解析,无法得到源代码的组件的属性参数,后续的调用代码解析器、执行目标组件生成函数对拼装代码进行解析时,会对应将属性参数传递至目标代码,因而在创建组件对象时,可以直接将对应的组件标签作为属性参数。
[0110]
将各组件标签分别设置为对应组件的属性参数,得到多个组件对象。具体的代码为:
[0111][0112]
根据多个组件对象,构建组件对象库,具体方式为:将多个组件对象进行封装,构建组件对象库。
[0113]
示例性地,将组件标签“div”设置为对应组件fakediv的属性参数props,将组件标签“button”设置为对应组件fakebutton的属性参数props,得到组件对象fakediv和组件对象fakebutton,将组件对象fakediv和组件对象fakebutton进行封装,构建组件对象库fakecomponentlib。
[0114]
将各组件标签分别设置为对应组件的属性参数,得到多个组件对象,根据多个组件对象,构建组件对象库。通过将各组件标签设置为对应组件的属性参数,保证了创建的组
件对象的准确度,同时无需将源代码中组件的属性参数进行识别并设置,提升了创建组件对象的效率,同时根据多个组件对象,构建组件对象库,为生成代码导入信息奠定了基础。
[0115]
可选地,根据组件对象库,生成代码导入信息,包括如下具体步骤:
[0116]
根据组件对象库,利用预先设置的代码导入信息模板,生成代码导入信息。
[0117]
根据组件对象库,利用预先设置的代码导入信息模板,生成代码导入信息,具体方式为:根据组件对象库中组件对象的组件标签,利用预先设置的代码导入信息模板,生成代码导入信息。
[0118]
代码导入信息模板为可以实现将组件对象的代码导入代码解析器的代码生成模板,具体的代码导入信息模板代码如下:
[0119][0120]
示例性地,根据组件对象的组件标签“div”“button”,利用预先设置的代码导入信息模板import${fakecomponent}from“${fakecomponentname}”,生成代码导入信息:
[0121]
import div from“div”;
[0122]
import button from“button”;
[0123]
根据组件对象库,利用预先设置的代码导入信息模板,生成代码导入信息。利用预先设置的代码导入信息模板,可以快速生成代码导入信息,提升了代码导入信息的生成效率,进而提升了代码转换的效率。
[0124]
可选地,步骤110包括如下具体步骤:
[0125]
根据组件对象库中的组件对象,确定目标组件;
[0126]
调用预设的代码解析器,执行目标组件生成函数,获得目标组件对应的目标组件标签和目标属性参数;
[0127]
根据目标组件标签和目标属性参数,生成特定格式的目标代码。
[0128]
目标组件为源代码中组件标签和属性参数不为空的组件对象。例如,以javascript为例,在代码编写过程中,存在定义为“《》《/》”这样的为了使得代码执行逻辑完整的空对象,这样组件对象没有属性参数,无法转换为对应的目标代码。
[0129]
根据组件对象库中的组件对象,确定目标组件,具体方式为:识别组件对象的组件标签和属性参数是否为空,若组件标签和属性参数为空,执行对组件对象库中的其他组件对象的解析,若组件标签和属性参数不为空,确定该组件对象为目标组件。具体方法代码为:
[0130][0131]
调用预设的代码解析器,执行目标组件生成函数,获得目标组件对应的目标组件标签和目标属性参数,具体方式为:执行目标组件生成函数,分析拼装代码中的字符串,从拼装代码中解析得到目标组件对应的目标组件标签和目标属性参数。具体方法代码为:
[0132][0133]
根据目标组件标签和目标属性参数,生成特定格式的目标代码,具体方式为:将目标组件标签和目标属性参数按照特定格式进行传递,生成目标代码。例如,目标组件标签为“componentname1”,目标属性参数为“prop1;prop2;prop3”,特定格式为:
[0134][0135]
生成目标代码为:
[0136][0137]
示例性地,根据组件对象库fakecomponentlib中的组件对象fakediv和fakebutton,确定拼装代码中对应的目标组件div和button,调用预设的代码解析器compiler,执行目标组件生成函数injectreactmodule,获得目标组件div和button对应的目标组件标签“div”、“button”和目标属性参数“classname=“mydiv”、“按钮”,根据目标组
件标签“div”“button”和目标属性参数“classname=“mydiv”、“按钮”,生成特定格式的目标代码:
[0138][0139]
根据组件对象库中的组件对象,确定目标组件,调用预设的代码解析器,执行目标组件生成函数,获得目标组件对应的目标组件标签和目标属性参数,根据目标组件标签和目标属性参数,生成特定格式的目标代码。根据组件对象库中的组件对象,确定目标组件,解决了源代码和目标代码之间的语法差异,而生成的目标代码无法进行后续的编译的问题,提升了目标代码的准确度;调用预设的代码解析器,执行目标组件生成函数,获得目标组件对应的目标组件标签和目标属性参数,直接基于代码层级进行解析,提升了解析效率,并且对应解析得到目标组件标签和目标属性参数,避免了在代码转换过程中出现遗漏,提升了目标代码的准确度。
[0140]
可选地,根据目标组件标签和目标属性参数,生成特定格式的目标代码,包括如下具体步骤:
[0141]
根据目标组件标签和目标属性参数,利用组件对象库对应的代码模板,生成特定格式的目标代码。
[0142]
代码模板为属性参数进行传递的目标代码生成模板,代码模板为特定格式。
[0143]
根据目标组件标签和目标属性参数,利用组件对象库对应的代码模板,生成特定格式的目标代码,具体方式为:将目标组件标签和目标属性参数传递至特定格式的代码模板的对应位置,生成目标代码。具体代码模板的代码为:
[0144][0145]
示例性地,目标组件标签为“div”、“button”,目标属性参数为“classname=“mydiv”、“按钮”,将目标组件标签“div”、“button”和目标属性参数“classname=“mydiv”、“按钮”传递至特定格式的代码模板的对应位置,生成特定格式的目标代码:
[0146][0147][0148]
根据目标组件标签和目标属性参数,利用组件对象库对应的代码模板,生成特定格式的目标代码。利用组件对象库对应的代码模板,可以准确对应目标组件变迁和目标属性参数,避免出现组件标签和属性参数的遗漏,提升了代码转换的准确性,也可以快速生成目标代码,提升了代码转换的效率。
[0149]
可选地,在步骤110之前,还包括如下具体步骤:
[0150]
获取初始组件生成函数,其中,初始组件生成函数包含将源代码生成可视化组件的组件生成子函数;
[0151]
将组件生成子函数替换为预设的代码生成子函数,得到目标组件生成函数。
[0152]
初始组件生成函数为对应不同源代码框架下的组件生成函数,例如,react框架下
的react createlement,spring框架下的bean元素生成函数,,net框架下的render元素生成函数等。
[0153]
组件生成子函数为初始组件生成函数中将源代码转换为可视化组件的函数,例如,源代码为:
[0154]
《html》
[0155]
《head》
[0156]
《title》xxx《/title》
[0157]
《/head》
[0158]
《/html》
[0159]
组件生成子函数将源代码转换为标题为“xxx”的显示页面的机器语言代码,进行编译后在前端进行显示。
[0160]
代码生成子函数为将源代码中转换为目标代码的代码转换函数。代码生成子函数的具体代码为:
[0161][0162]
示例性地,获取react框架下的初始组件生成函数react createlement,组件生成子函数createelement替换为预设的代码生成子函数hijackcreateelement,得到目标组件生成函数:
[0163]
const injectreactmodule={
[0164]
createelement:(key:string,props:ifieldprops={},)=》{
[0165]
return hijackcreateelement(key,props);
[0166]
}
[0167]
获取初始组件生成函数,其中,初始组件生成函数包含将源代码生成可视化组件的组件生成子函数,将组件生成子函数替换为预设的代码生成子函数,得到目标组件生成函数。通过将初始组件生成函数的组件生成子函数替换为预设的代码生成子函数,得到目标组件生成函数,为后续进行解析提供了函数基础,提升了代码转换的效率和准确度。
[0168]
可选地,步骤104包括如下具体步骤:
[0169]
利用正则表达式,对源代码进行检索,得到源代码中的组件标签。
[0170]
正则表达式(regular expression),是一种文本模式,通过对代码中的字符串进行匹配,实现检索,得到对应的字符串。
[0171]
利用正则表达式,对源代码进行检索,得到源代码中的组件标签,具体方式为,根
据组件标签的字符串特征,设定正则表达式,利用正则表达式,对源代码进行检索,得到源代码中的组件标签。根据组件标签的字符串特征为字符串左侧存在字符“《”,y右边可能存在字符“》”,因而设定正则表达式为htmlregx=/《[》]?/,即为左侧存在字符“《”,右侧可能存在字符“》”具体代码为:
[0172][0173]
根据组件代码的字符串特征,利用正则表达式const htmlregx=/《[》]?/g,对源代码进行检索,得到组件标签“div”和“button”。
[0174]
利用正则表达式,对源代码进行检索,得到源代码中的组件标签。利用正则表达式对源代码进行检索,得到组件标签,提升了组件标签识别的准确度,避免代码转换过程中出现遗漏,保证了代码转换的准确度。
[0175]
可选地,在步骤110之前,还包括如下具体步骤:
[0176]
获取代码转换器,其中,代码转换器包括对象转换模块;
[0177]
修改对象转换模块的参数,得到代码解析器。
[0178]
代码转换器是预先根据源代码设定的,将源代码转换为机器语言的转换器。代码转换器包括对象转换模块,对象转换模块将源代码转换为可视化组件的机器语言后进行编译。
[0179]
修改对象转换模块的参数,得到代码解析器,具体方式为:根据目标代码的代码形式,修改对象转换模块的参数,得到代码解析器,以使代码解析器可以对源代码的组件标签和属性参数进行解析后,生成特定格式的目标代码。
[0180]
示例性地,根据目标代码的代码形式:
[0181][0182]
修改对象转换模块的参数,得到代码解析器,以使代码解析器对源代码的组件标签和属性参数进行解析,得到“componentname”、“prop1;prop2;prop3”,生成特定格式的目标代码:
[0183][0184]
获取代码转换器,其中,代码转换器包括对象转换模块,修改对象转换模块的参数,得到代码解析器。通过对代码转换器中的对象转换模块参数进行修改,而无需重新构建代码解析器,构建代码解析器的效率,同时也避免了对重新构建的代码解析器进行调试,才能对拼装代码进行解析,提升了转换的准确度。
[0185]
下述结合附图2,以本说明书提供的代码转换方法在jsx代码和低代码底层协议的应用为例,对代码转换方法进行进一步说明。其中,图2示出了本说明书一个实施例提供的一种应用于jsx代码和低代码底层协议的代码转换方法的处理过程流程图,具体包括以下步骤。
[0186]
步骤202:获取jsx代码;
[0187]
具体的jsx代码如下:
[0188][0189][0190]
步骤204:运用正则表达式,识别出jsx代码中的组件标签;
[0191]
具体的正则表达式如下:
[0192]
htmlregx=/《[》]?/。
[0193]
识别得到jsx代码中使用的组件div和button,得到其组件标签“div”和“button”。
[0194]
步骤206:根据组件标签创建对应的多个组件对象,得到组件对象库;
[0195]
根据组件标签“div”和“button”创建对应的多个组件对象fakediv和fakebutton,得到组件对象库fakecomponentlib。
[0196]
步骤208:根据组件对象库,利用代码导入信息生成模板,生成代码导入信息;
[0197]
根据组件对象库fakecomponentlib,利用代码导入信息生成模板:
[0198]
import${fakecomponent}from“${fakecomponentname}
[0199]
,生成代码导入信息:
[0200]
import div from“div”;
[0201]
import button from“button”;
[0202]
步骤210:将代码导入信息和jsx代码进行拼装,得到拼装代码;
[0203]
具体的拼装代码newcontent:
[0204][0205]
步骤212:将组件对象库和预先构建的目标组件生成函数注入代码解析器;
[0206]
将组件对象库fakecomponentlib和预先构建的目标组件生成函数injectreactmodule注入代码解析器compiler。
[0207]
步骤214:代码解析器对拼装代码进行解析,得到低代码底层协议;
[0208]
具体的低代码底层协议(lowcode schema)
[0209][0210][0211]
步骤216:根据低代码底层协议,生成对应的可拖拽组件,并显示在前端。
[0212]
用户通过在前端拖拽组件“div”即可在页面上划分对应区域,用户通过在前端拖拽组件“button”即可在页面上生成对应的按钮,进而实现页面开发。
[0213]
图3示出了本说明书一个实施例提供的一种应用于jsx代码和低代码底层协议的代码转换方法的处理流程示意图。
[0214]
如图3所示,对jsx代码进行识别,识别出jsx代码中使用到的组件标签,再根据组件标签创建对应的组件对象库,根据组件对象库生成代码导入信息,将代码导入信息和jsx代码进行拼装得到拼装代码,将组件对象库和预先构建的目标组件生成函数导入预先设置的代码解析器中,利用代码解析器对拼装代码进行解析,得到低代码底层协议(lowcode schema)。
[0215]
图4示出了本说明书一个实施例提供的一种应用于jsx代码和低代码底层协议的代码转换方法的前端显示效果图。
[0216]
如图4所示,在产品开发前端界面上,左侧为页面产品显示效果区域,右侧为可拖拽组件列表,包括区域组件和按钮组件,用户通过将区域组件拖拽至页面产品显示效果区域,即可对页面上划分出对应区域,用户通过将按钮组件拖拽至页面产品显示效果区域,即可在页面上生成对应的按钮。
[0217]
本说明书实施例中,运用正则表达式,识别出jsx代码中的组件标签,避免转换为低代码底层协议的过程中,出现组件的遗漏和错误,提升了识别的准确度,根据组件标签创建对应的多个组件对象,得到组件对象库,通过组件标签对应创造组件对象库,可以准确地对jsx代码进行代码转换,避免了代码转换中出现遗漏和错误,提升了代码转换的准确度,并且生成代码导入信息,为后续进行解析提供了解析对象条件,保证了后续解析的顺利执行,根据组件对象库,利用代码导入信息生成模板,生成代码导入信息,快速生成代码导入信息,提升了代码导入信息的生成效率,进而提升了代码转换的效率,调用代码解析器,执行目标组件生成函数,可以基于组件生成时对拼装代码的解析和生成,进而根据代码层级的拼装代码直接进行代码转换,生成低代码底层协议,避免了在代码转换过程中出现遗漏,提升了代码转换的适应度和准确度,再根据低代码底层协议,生成对应的可拖拽组件,并显示在前端,使得用户通过在前端拖拽组件,即可进行产品开发,降低了产品开发的复杂度,提升了产品开发的效率。
[0218]
图5示出了本说明书一个实施例提供的一种代码互转的示意图。
[0219]
如图5所示,将低代码(lowcode)转换为专业代码(procode)的方法为:通过遍历低代码(lowcode)中各组件,解析低代码(lowcode)中各组件,得到各组件的组件标签和组件属性参数,通过对应关系将低代码(lowcode)中的组件标签转换为专业代码(procode)中的组件标签,将低代码(lowcode)中的组件属性参数转换为专业代码(procode)中的组件属性接口,重复上述步骤直到完成对低代码(lowcode)中各组件的代码转换,得到专业代码(procode)。
[0220]
可逆地,将专业代码(procode)转换为低代码(lowcode)的方法有:
[0221]
方法一:对专业代码(procode)进行语法解析,构建专业代码(procode)的抽象语法树,遍历抽象语法树,得到多个语法节点的标签和属性参数,利用多个语法节点的标签和属性参数,将专业代码(procode)转换为低代码(lowcode);
[0222]
方法二:从专业代码(procode)中识别组件标签,根据组件标签,生成代码导入信息,对专业代码(procode)和代码导入信息进行拼装,得到拼装代码,调用预设的代码解析器,执行目标组件生成函数对拼装代码进行解析,生成特定格式的低代码(lowcode)。
[0223]
与上述方法实施例相对应,本说明书还提供了代码转换装置实施例,图6示出了本说明书一个实施例提供的一种代码转换装置的结构示意图。如图6所示,该装置包括:
[0224]
源代码获取模块602,被配置为获取源代码;
[0225]
组件标签识别模块604,被配置为从源代码中识别组件标签;
[0226]
代码导入信息生成模块606,被配置为根据组件标签,生成代码导入信息;
[0227]
拼装模块608,被配置为对源代码和代码导入信息进行拼装,得到拼装代码;
[0228]
目标代码生成模块610,被配置为调用预设的代码解析器,执行目标组件生成函数对拼装代码进行解析,生成特定格式的目标代码。
[0229]
可选地,代码导入信息生成模块606被进一步配置为:
[0230]
根据组件标签,创建组件对象库;
[0231]
根据组件对象库,生成代码导入信息。
[0232]
可选地,代码导入信息生成模块606被进一步配置为:
[0233]
将各组件标签分别设置为对应组件的属性参数,得到多个组件对象;
[0234]
根据多个组件对象,构建组件对象库。
[0235]
可选地,代码导入信息生成模块606被进一步配置为:
[0236]
根据组件对象库,利用预先设置的代码导入信息模板,生成代码导入信息。
[0237]
可选地,目标代码生成模块610被进一步配置为:
[0238]
根据组件对象库中的组件对象,确定目标组件;
[0239]
调用预设的代码解析器,执行目标组件生成函数,获得目标组件对应的目标组件标签和目标属性参数;
[0240]
根据目标组件标签和目标属性参数,生成特定格式的目标代码。
[0241]
可选地,目标代码生成模块610被进一步配置为:
[0242]
根据目标组件标签和目标属性参数,利用组件对象库对应的代码模板,生成特定格式的目标代码。
[0243]
可选地,该装置还包括:
[0244]
目标组件生成函数构建模块,被配置为获取初始组件生成函数,其中,初始组件生成函数包含将源代码生成可视化组件的组件生成子函数;将组件生成子函数替换为预设的代码生成子函数,得到目标组件生成函数。
[0245]
可选地,组件标签识别模块604被进一步配置为:
[0246]
利用正则表达式,对源代码进行检索,得到源代码中的组件标签。
[0247]
可选地,该装置还包括:
[0248]
代码解析器构建模块,被配置为获取代码转换器,其中,代码转换器包括对象转换模块;修改对象转换模块的参数,得到代码解析器。
[0249]
本说明书实施例中,获取源代码,从源代码中识别组件标签,根据组件标签,生成代码导入信息,对源代码和代码导入信息进行拼装,得到拼装代码,调用预设的代码解析器,执行目标组件生成函数对拼装代码进行解析,生成特定格式的目标代码。根据源代码中的组件标签生成代码导入信息,再对源代码和代码导入信息进行拼装得到拼装代码,调用代码解析器,执行目标组件生成函数,可以基于组件生成时对拼装代码的解析和生成,进而根据代码层级的拼装代码直接进行代码转换,生成目标代码,避免了在代码转换过程中出现遗漏,提升了代码转换的适应度和准确度。
[0250]
上述为本实施例的一种代码转换装置的示意性方案。需要说明的是,该代码转换
装置的技术方案与上述的代码转换方法的技术方案属于同一构思,代码转换装置的技术方案未详细描述的细节内容,均可以参见上述代码转换方法的技术方案的描述。
[0251]
图7示出了根据本说明书一个实施例提供的一种计算设备的结构框图。该计算设备700的部件包括但不限于存储器710和处理器720。处理器720与存储器710通过总线730相连接,数据库750用于保存数据。
[0252]
计算设备700还包括接入设备740,接入设备740使得计算设备700能够经由一个或网络760通信。这些网络的示例包括公用交换电话网(pstn,public switched telephone network)、局域网(lan,local area network)、广域网(wan,wide area network)、个域网(pan,personal area network)或诸如因特网的通信网络的组合。接入设备740可以包括有线或无线的任何类型的网络接口(例如,网络接口卡(nic,network interface controller))中的一个或多个,诸如ieee802.11无线局域网(wlan,wireless local area networks)无线接口、全球微波互联接入(wi-max,world interoperability for microwave access)接口、以太网接口、通用串行总线(usb,universal serial bus)接口、蜂窝网络接口、蓝牙接口、近场通信(nfc,near field communication)接口,等等。
[0253]
在本说明书的一个实施例中,计算设备700的上述部件以及图7中未示出的其他部件也可以彼此相连接,例如通过总线。应当理解,图7所示的计算设备结构框图仅仅是出于示例的目的,而不是对本说明书范围的限制。本领域技术人员可以根据需要,增添或替换其他部件。
[0254]
计算设备700可以是任何类型的静止或移动计算设备,包括移动计算机或移动计算设备(例如,平板计算机、个人数字助理、膝上型计算机、笔记本计算机、上网本等)、移动电话(例如,智能手机)、可佩戴的计算设备(例如,智能手表、智能眼镜等)或其他类型的移动设备,或者诸如台式计算机或pc的静止计算设备。计算设备700还可以是移动式或静止式的服务器。
[0255]
其中,处理器720用于执行如下计算机可执行指令,该计算机可执行指令被处理器执行时实现上述代码转换方法的步骤。
[0256]
上述为本实施例的一种计算设备的示意性方案。需要说明的是,该计算设备的技术方案与上述的代码转换方法的技术方案属于同一构思,计算设备的技术方案未详细描述的细节内容,均可以参见上述代码转换方法的技术方案的描述。
[0257]
本说明书一实施例还提供一种计算机可读存储介质,其存储有计算机可执行指令,该计算机可执行指令被处理器执行时实现上述代码转换方法的步骤。
[0258]
上述为本实施例的一种计算机可读存储介质的示意性方案。需要说明的是,该存储介质的技术方案与上述的代码转换方法的技术方案属于同一构思,存储介质的技术方案未详细描述的细节内容,均可以参见上述代码转换方法的技术方案的描述。
[0259]
本说明书一实施例还提供一种计算机程序,其中,当所述计算机程序在计算机中执行时,令计算机执行上述代码转换方法的步骤。
[0260]
上述为本实施例的一种计算机程序的示意性方案。需要说明的是,该计算机程序的技术方案与上述的代码转换方法的技术方案属于同一构思,计算机程序的技术方案未详细描述的细节内容,均可以参见上述代码转换方法的技术方案的描述。
[0261]
上述对本说明书特定实施例进行了描述。其它实施例在所附权利要求书的范围
内。在一些情况下,在权利要求书中记载的动作或步骤可以按照不同于实施例中的顺序来执行并且仍然可以实现期望的结果。另外,在附图中描绘的过程不一定要求示出的特定顺序或者连续顺序才能实现期望的结果。在某些实施方式中,多任务处理和并行处理也是可以的或者可能是有利的。
[0262]
所述计算机指令包括计算机程序代码,所述计算机程序代码可以为源代码形式、对象代码形式、可执行文件或某些中间形式等。所述计算机可读介质可以包括:能够携带所述计算机程序代码的任何实体或装置、记录介质、u盘、移动硬盘、磁碟、光盘、计算机存储器、只读存储器(rom,read-only memory)、随机存取存储器(ram,random access memory)、电载波信号、电信信号以及软件分发介质等。
[0263]
需要说明的是,对于前述的各方法实施例,为了简便描述,故将其都表述为一系列的动作组合,但是本领域技术人员应该知悉,本说明书实施例并不受所描述的动作顺序的限制,因为依据本说明书实施例,某些步骤可以采用其它顺序或者同时进行。其次,本领域技术人员也应该知悉,说明书中所描述的实施例均属于优选实施例,所涉及的动作和模块并不一定都是本说明书实施例所必须的。
[0264]
在上述实施例中,对各个实施例的描述都各有侧重,某个实施例中没有详述的部分,可以参见其它实施例的相关描述。
[0265]
以上公开的本说明书优选实施例只是用于帮助阐述本说明书。可选实施例并没有详尽叙述所有的细节,也不限制该发明仅为所述的具体实施方式。显然,根据本说明书实施例的内容,可作很多的修改和变化。本说明书选取并具体描述这些实施例,是为了更好地解释本说明书实施例的原理和实际应用,从而使所属技术领域技术人员能很好地理解和利用本说明书。本说明书仅受权利要求书及其全部范围和等效物的限制。
技术特征:1.一种代码转换方法,包括:获取源代码;从所述源代码中识别组件标签;根据所述组件标签,生成代码导入信息;对所述源代码和所述代码导入信息进行拼装,得到拼装代码;调用预设的代码解析器,执行目标组件生成函数对所述拼装代码进行解析,生成特定格式的目标代码。2.根据权利要求1所述的方法,所述根据所述组件标签,生成代码导入信息,包括:根据所述组件标签,创建组件对象库;根据所述组件对象库,生成代码导入信息。3.根据权利要求2所述的方法,所述根据所述组件标签,创建组件对象库,包括:将各组件标签分别设置为对应组件的属性参数,得到多个组件对象;根据所述多个组件对象,构建组件对象库。4.根据权利要求2所述的方法,所述根据所述组件对象库,生成代码导入信息,包括:根据所述组件对象库,利用预先设置的代码导入信息模板,生成代码导入信息。5.根据权利要求2-4中任一项所述的方法,所述调用预设的代码解析器,执行目标组件生成函数对所述拼装代码进行解析,生成特定格式的目标代码,包括:根据所述组件对象库中的组件对象,确定目标组件;调用预设的代码解析器,执行目标组件生成函数,获得所述目标组件对应的目标组件标签和目标属性参数;根据所述目标组件标签和所述目标属性参数,生成特定格式的目标代码。6.根据权利要求5所述的方法,所述根据所述目标组件标签和所述目标属性参数,生成特定格式的目标代码,包括:根据所述目标组件标签和所述目标属性参数,利用所述组件对象库对应的代码模板,生成特定格式的目标代码。7.根据权利要求1所述的方法,在所述调用预设的代码解析器,执行目标组件生成函数对所述拼装代码进行解析,生成特定格式的目标代码之前,还包括:获取初始组件生成函数,其中,所述初始组件生成函数包含将源代码生成可视化组件的组件生成子函数;将所述组件生成子函数替换为预设的代码生成子函数,得到目标组件生成函数。8.根据权利要求1所述的方法,所述从所述源代码中识别组件标签,包括:利用正则表达式,对所述源代码进行检索,得到所述源代码中的组件标签。9.根据权利要求1所述的方法,在所述调用预设的代码解析器,执行目标组件生成函数对所述拼装代码进行解析,生成特定格式的目标代码之前,还包括:获取代码转换器,其中,所述代码转换器包括对象转换模块;修改所述对象转换模块的参数,得到代码解析器。10.一种代码转换装置,包括:源代码获取模块,被配置为获取源代码;组件标签识别模块,被配置为从所述源代码中识别组件标签;
代码导入信息生成模块,被配置为根据所述组件标签,生成代码导入信息;拼装模块,被配置为对所述源代码和所述代码导入信息进行拼装,得到拼装代码;目标代码生成模块,被配置为调用预设的代码解析器,执行目标组件生成函数对所述拼装代码进行解析,生成特定格式的目标代码。11.一种计算设备,包括:存储器和处理器;所述存储器用于存储计算机可执行指令,所述处理器用于执行所述计算机可执行指令,该计算机可执行指令被处理器执行时实现权利要求1至9任意一项所述代码转换方法的步骤。12.一种计算机可读存储介质,其存储有计算机可执行指令,该计算机可执行指令被处理器执行时实现权利要求1至9任意一项所述代码转换方法的步骤。
技术总结本说明书实施例提供代码转换方法以及装置,其中所述代码转换方法包括:获取源代码,从源代码中识别组件标签,根据组件标签,生成代码导入信息,对源代码和代码导入信息进行拼装,得到拼装代码,调用预设的代码解析器,执行目标组件生成函数对拼装代码进行解析,生成特定格式的目标代码。根据源代码中的组件标签生成代码导入信息,再对源代码和代码导入信息进行拼装得到拼装代码,调用代码解析器,执行组件生成函数,可以基于组件生成时对拼装代码的解析和生成,进而根据拼装代码的执行逻辑来进行代码转换,生成目标代码,避免了在代码转换过程中出现遗漏,提升了代码转换的适应度和准确度。确度。确度。
技术研发人员:郑怡灵 范喆 黄文浩 郑淳 周明波 李文 李靖贤 任天启 庞海杰 彭梓浩 刘祥
受保护的技术使用者:阿里巴巴(中国)有限公司
技术研发日:2022.07.11
技术公布日:2022/11/1