Code annotation automatic generation method and system, terminal and medium

By building an automatic code annotation generation model and automatically generating annotation text using mouse levitation events, it solves the inefficiency problem of developers manually adding annotations, and realizes efficient and accurate code annotation generation, improving development efficiency and user understanding convenience.

CN120407012APending Publication Date: 2025-08-01浪潮智慧科技有限公司 +1
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202510558137.7
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2025-04-29
Publication Date
2025-08-01

AI Technical Summary

Technical Problem

In the prior art, developers need to manually add code comments, which leads to wasting time and energy, and the comments are easily missed or inconsistent with the code logic, affecting the efficiency of code understanding.

Method used

By collecting the front-end developed code snippets and annotation samples, building a data set and training the code annotation automatically generates a model, using the mouse suspension event to generate annotation text, and using the Transformer architecture model for automatic annotation generation.

Benefits of technology

It reduces the work burden of developers, improves development efficiency, ensures that the annotations are consistent with the code logic, avoids the missing annotations, and improves the convenience of user understanding.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN120407012A_ABST
    Figure CN120407012A_ABST
Patent Text Reader

Abstract

The invention relates to the field of code processing, and particularly discloses a code annotation automatic generation method and system, a terminal and a medium, and the method comprises the steps: collecting a plurality of code snippets developed at a front end, and labeling annotation samples for the code snippets; constructing the plurality of code snippets and the annotation samples thereof into a data set; training a pre-constructed code annotation automatic generation model by using the data set; and determining a target code snippet through the mouse suspension event, and generating an annotation text for the target code snippet by using the code annotation automatic generation model. According to the method, automatic code annotation generation is realized, the workload of developers is reduced, the development efficiency is improved, annotation of all codes can be supported, annotation generation based on actual codes is realized, logic inconformity with the actual codes is avoided, and user understanding convenience is improved.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to the field of code processing, and particularly to a method, system, terminal and medium for automatically generating code comments. Background Art

[0002] In a team, different developers have different coding styles and technical backgrounds. As a communication bridge in the code, comments allow developers to leave useful hints beside the code, which are not only helpful for their future work, but also for other team members. When developers read the source code, comments can provide intuitive guidance and explanations, thus reducing the time required to understand and study individual code blocks. They can provide historical information, telling later developers when, by whom and why specific changes were made, and also provide background information that may be needed when solving problems. They can help reviewers understand the context of the code faster, thus making more accurate evaluations. Ensuring that there are sufficient comments in the code allows all team members, regardless of their technical backgrounds, to quickly understand the logic and judgment behind the code. However, currently, comments are generally manually marked by developers, which results in a large amount of time and effort being consumed for adding comments, reducing development efficiency, and it is very easy to miss some markings, leading to difficulties in subsequent understanding. In addition, once the code changes, developers may also miss updating the corresponding comments, resulting in the comments not matching the actual code logic. Summary of the Invention

[0003] To solve the above problems, the present invention provides a method, system, terminal and medium for automatically generating code comments, which can automatically generate comments for the code, reduce the workload of developers, improve development efficiency, and can support commenting on all codes, generate comments based on the actual code, avoid inconsistencies with the actual code logic, and improve the convenience of user understanding.

[0004] In a first aspect, the technical solution of the present invention provides a method for automatically generating code comments, including the following steps: Collect a number of code segments for front-end development and label comment samples for each code segment; Construct a data set from the number of code segments and their comment samples; Use the data set to train a pre-constructed code comment automatic generation model; Determine the target code segment through a mouse hover event, and use the code comment automatic generation model to generate comment text for the target code segment.

[0005] In an optional embodiment, using the code comment automatic generation model to generate comment text for the target code segment specifically includes: Detect whether the comment automatic generation function is enabled; If so, listen for the mouse hover event; When the mouse hovers over a line of code, obtain the content of this line of code; Determine the target code snippet based on the content of this line of code; Call the code comment automatic generation model, and use the code comment automatic generation model to generate comment text for the target code snippet.

[0006] In an optional implementation, determining the target code snippet based on the content of this line of code specifically includes: Detect whether the current line of code contains a call to a js event; If not, use this line of code as the target code snippet; If so, search for relevant code within the current page or other called pages based on the event name; Use this line of code and the found relevant code as the target code snippet.

[0007] In an optional implementation, using the code comment automatic generation model to generate comment text for the target code snippet specifically includes: Send an HTTP request carrying the target code snippet, and based on the HTTP request, call the code comment automatic generation model to generate comment text for the target code snippet; Receive the comment text fed back by the code comment automatic generation model.

[0008] In an optional implementation, the method further includes the following steps: Detect the current code technology architecture; Convert the comment text into a comment text format adapted to the current code technology architecture; Display the comment text content in a pop-up window on the human-computer interaction interface.

[0009] In an optional implementation, the code comment automatic generation model is an architecture of Transformer, including a word embedding layer, multiple encoder layers, a linear layer, a softmax function, a decoder, and a post-processing module; The word embedding layer converts the input text into a vector representation. The vector representation undergoes feature extraction through multiple encoder layers. The extracted features pass through a linear layer and a softmax function to obtain a predicted probability distribution. The decoder generates a predicted output sample based on the encoder output and the predicted probability distribution. The post-processing module converts the predicted output sample into a predicted comment sample.

[0010] In an optional implementation, when using a dataset to train the pre-constructed code comment automatic generation model, convert the code snippet into a token sequence as the input text; the predicted output sample of the code comment automatic generation model is in the form of a token sequence.

[0011] In a second aspect, the technical solution of the present invention provides a code comment automatic generation system, including: A data collection module, configured to collect a number of code snippets for front-end development and label annotation samples for each code snippet; A data set construction module, configured to construct a data set from a number of code snippets and their annotation samples; A model training module, configured to train a pre-constructed code comment automatic generation model using the data set; An annotation generation module, configured to determine a target code snippet through a mouse hovering event and generate an annotation text for the target code snippet using the code comment automatic generation model.

[0012] In a third aspect, the technical solution of the present invention provides a terminal, including: A memory, configured to store a code comment automatic generation program; A processor, configured to implement the steps of the code comment automatic generation method as described in any one of the above when executing the code comment automatic generation program.

[0013] In a fourth aspect, the technical solution of the present invention provides a computer-readable storage medium, on which a code comment automatic generation program is stored, and when the code comment automatic generation program is executed by a processor, the steps of the code comment automatic generation method as described in any one of the above are implemented.

[0014] It can be seen from the above technical solutions that the present application has the following advantages: First, a number of code snippets and their annotation samples are collected to form a data set to train the code comment automatic generation model. Then, during actual use, the code comment automatic generation model can automatically generate annotation text for the target code snippet. The present invention gets rid of the cumbersome process of manual annotation. Developers no longer need to spend a lot of time and effort adding comments line by line and block by block, reducing the workload of developers and improving the overall development efficiency. Moreover, when the code changes, using the code comment automatic generation model, accurate comments can be quickly generated according to the new target code snippet without manual update, ensuring that the comments are always consistent with the code logic. In addition, by collecting a large number of front-end development code snippets and annotating them to construct a rich data set to train the model, comments can be comprehensively generated for the code, avoiding the problem of missing comments, and enabling corresponding comment explanations for each key part of the code, improving the convenience of user understanding. Description of the Drawings

[0015] To more clearly illustrate the technical solutions of this application, the following will briefly introduce the accompanying drawings required for the description. Obviously, the accompanying drawings in the following description are only some embodiments of this application. For those of ordinary skill in the art, without creative efforts, other accompanying drawings can be obtained based on these drawings.

[0016] Figure 1 Schematic flowchart of a method for automatically generating code comments provided by an embodiment of the present invention.

[0017] Figure 2 Schematic block diagram of the structure of a system for automatically generating code comments provided by an embodiment of the present invention.

[0018] Figure 3 Schematic diagram of the structure of a terminal provided by an embodiment of the present invention. Detailed implementation manners

[0019] To make the application purpose, features, and advantages of this application more obvious and understandable, the following will use specific embodiments and accompanying drawings to clearly and completely describe the technical solutions protected by this application. Obviously, the embodiments described below are only some embodiments of this application, rather than all embodiments. Based on the embodiments in this application, all other embodiments obtained by those of ordinary skill in the art without creative efforts belong to the scope protected by this application.

[0020] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as commonly understood by those of ordinary skill in the technical field to which this invention belongs. The terms used in the description of this invention herein are only for the purpose of describing specific embodiments and are not intended to limit this invention.

[0021] Figure 1 Schematic flowchart of a method for automatically generating code comments provided by an embodiment of the present invention. Among them, Figure 1 The execution subject can be a system for automatically generating code comments. The method for automatically generating code comments provided by the embodiments of the present invention is executed by a computer device. Correspondingly, the system for automatically generating code comments runs in the computer device. According to different requirements, the order of the steps in this flowchart can be changed, and some can be omitted.

[0022] As Figure 1 shown, the method includes the following steps.

[0023] S1, Collect a number of code snippets for front-end development and label annotation samples for each code snippet.

[0024] This step collects various code snippets from the front-end development field and adds corresponding annotation content to each code snippet as annotation samples. These samples will serve as the basic data for subsequent model training. The collected code snippets cover various application scenarios and technical implementations, ensuring that the model has broad applicability and can generate accurate annotations with reference to different types of target code snippets.

[0025] S2. Construct a data set from several code snippets and their annotation samples.

[0026] This step sorts out and combines the collected front-end code snippets and corresponding annotation samples, and can construct a data set for model training according to a certain format and structure. By constructing the data set, data preprocessing such as data cleaning and standardization can be carried out to remove noise data and improve data quality, so that the model can learn the more accurate association relationship between code and annotations.

[0027] S3. Use the data set to train the pre-constructed automatic code annotation generation model.

[0028] This step uses the constructed data set to train the already built automatic code annotation generation model, enabling the model to learn the relationship between the code snippets and annotation samples in the data set. During the training process, the model continuously optimizes its own parameters to improve its annotation generation ability. After being trained with a large amount of data, the model can master the internal laws between the structure, semantics of the code and the annotations, improving the accuracy and rationality of the generated annotations. The model can learn the appropriate annotation methods corresponding to different code logics, and thus when facing new target code snippets, it can generate annotation texts that conform to the actual situation of the code according to the learned laws, reducing the generation of incorrect annotations.

[0029] S4. Determine the target code snippet through the mouse hover event, and use the automatic code annotation generation model to generate an annotation text for the target code snippet.

[0030] This step first determines the target code snippet through the mouse hover event, inputs the target code snippet that needs to add annotations into the trained automatic code annotation generation model, and the model outputs the corresponding annotation text according to the knowledge learned before.

[0031] The code annotation automatic generation method of this embodiment gets rid of the cumbersome process of manually annotating comments. Developers no longer need to spend a lot of time and effort adding comments line by line and block by block, reducing the workload of developers and improving the overall development efficiency. Moreover, when the code changes, using the code annotation automatic generation model, accurate comments can be quickly generated according to the new target code snippet without manual update, ensuring that the comments are always consistent with the code logic. In addition, by collecting a large number of front-end development code snippets and annotating them, a rich data set is constructed to train the model, which can comprehensively generate comments for the code, avoid the problem of missing comments, and enable corresponding comment explanations for each key part of the code, improving the convenience of user understanding.

[0032] Further, as a refinement and extension of the specific implementation manner of the above embodiment, in order to completely illustrate the specific implementation process in this embodiment, another code annotation automatic generation method is provided, and this method includes the following steps.

[0033] SS1, Collect a number of code snippets for front-end development and label annotation samples for each code snippet.

[0034] In some optional implementation manners, collect HTML, CSS, and JavaScript required for front-end development, as well as various derived technologies and various framework language structures used in web, app, and applet, such as vue, react, Angular, native WeChat applet, uniapp, vant, etc.

[0035] Exemplarily, use a crawler tool to obtain the code and the corresponding comments, send an HTTP request, and parse the HTML content. For example, visit the official elementUi website, find the component list and description, obtain the component hyperlink, dynamically access these links, and crawl the component attribute parameters and descriptions. The attribute parameters are used as the recognized keywords, and the description is the comment content.

[0036] Collect code snippets of HTML, CSS, JavaScript and their derived technologies, as well as various framework language structures used in web, app, and applet (such as Vue, React, Angular, native WeChat applet, UniApp, Vant, etc.) to achieve comprehensive data collection, covering all fields and scenarios of front-end development. After learning these diverse data, the model can better adapt to the code characteristics under different technology stacks and frameworks, and improve the ability to generate comments for various types of front-end code.

[0037] SS2, Construct a data set from a number of code snippets and their annotation samples.

[0038] In some alternative embodiments, the data extracted in step SS1 is first preprocessed, including removing irrelevant characters, standardizing the format, handling mixed languages, and performing word segmentation or tokenization.

[0039] The preprocessed data is divided into a training set, a validation set, and a test set according to a certain ratio. For example, the division ratio is 70% for the training set, 15% for the validation set, and 15% for the test set. The training set is used for training the model to enable the model to learn the association rules between code snippets and annotation samples; the validation set is used to evaluate the performance of the model during the model training process, adjust the hyperparameters of the model, and prevent the model from overfitting; the test set is used to independently evaluate the generalization ability and final performance of the model after the model training is completed.

[0040] SS3. Use the dataset to train the pre-constructed code annotation automatic generation model.

[0041] In this step, by learning the attributes of a large number of labels and their annotation data, the basic structure and semantic rules of the language are mastered. A large number of code snippets are input, keywords in them are identified, and the annotations are obtained and connected into easy-to-understand coherent text to better adapt to different application scenarios.

[0042] In some alternative embodiments, the code annotation automatic generation model is an architecture of Transformer, including a word embedding layer, multiple encoder layers, a linear layer, a softmax function, a decoder, and a post-processing module. The word embedding layer converts the input text into a vector representation. The vector representation undergoes feature extraction through multiple encoder layers. The extracted features pass through a linear layer and a softmax function to obtain a predicted probability distribution. The decoder generates a predicted output sample based on the encoder output and the predicted probability distribution. The post-processing module converts the predicted output sample into a predicted annotation sample.

[0043] In some alternative embodiments, the parameters of the model are randomly initialized. The loss value is calculated based on the predicted output and the true label. Starting from the loss function, according to the chain rule, the gradients of the parameters of each layer are calculated in turn. The parameters of the model are updated according to the calculated gradients, the hyperparameters are adjusted according to the evaluation results, and then the model is retrained until satisfactory performance is obtained to generate the model. The trained model is used to generate coherent and logical annotation text.

[0044] To better learn the relationships and structures between words, when using the dataset to train the pre-constructed code annotation automatic generation model, the code snippets are converted into a token sequence as the input text; the predicted output sample of the code annotation automatic generation model is in the form of a token sequence. A Token usually represents a component of a word or a character.

[0045] In some alternative embodiments, the input to the model includes code snippets and keyword information. The code snippets include HTML, CSS, and JavaScript code. For example, for the CSS part, code with class or style attributes may be input, such as the class selector style code like.myClass{color:red;font-size:16px;}; for the JavaScript part, code containing event attributes such as click and change may be input, such as document.getElementById('button').addEventListener('click',function(){console.log('Button clicked');});. When looking for specific comments, keywords are also input, such as class and style in CSS, click and change in JavaScript, etc. These keywords are used to locate and filter the parts of the code that need to be explained, helping the model focus on the code features that developers are concerned about.

[0046] The output of the model is code comment text. For example, for the input CSS code.myClass{color:red;font-size:16px;}, the output comment may be "This class selector.myClass is used to set the text color of the element to red and the font size to 16 pixels"; for the input JavaScript code document.getElementById('button').addEventListener('click',function(){console.log('Button clicked');});, the output comment may be "This code uses the document.getElementById method to obtain the element with the ID of button and adds a click event listener to it. When the button is clicked, Button clicked will be output to the console."

[0047] Specifically, the word embedding layer converts the input text into a vector representation, which can map words or symbols in the text to a low-dimensional continuous vector space, enabling the model to capture the semantic and syntactic relationships between words. When generating code comments, after elements such as keywords and variable names in the code are word-embedded, the model can better understand their meanings and interrelationships. For example, the distance between "function" and a specific function name in the vector space can reflect the semantic association.

[0048] Multiple encoder layers can perform deep feature extraction on the input vector representation. Different encoder layers can mine text features from different levels and perspectives, capturing complex information such as code structure and logical dependencies. For example, features such as function call relationships and loop structures in the code can be identified.

[0049] The linear layer can perform a linear transformation on the features extracted by the encoder, adjusting the feature dimensions and weights to meet the requirements of the prediction task. The softmax function converts the output of the linear layer into a probability distribution, which can represent the prediction possibility of the model for different annotation contents, helping the model make a reasonable choice among many possible annotations. The predicted probability distribution represents the probability that the model believes each possible word or symbol will be output as the next annotation. For example, for a piece of code, the model may predict that the probability of the next word being "obtain" is 0.3, and the probability of "set" is 0.1, etc. These probability values reflect the model's judgment of various possibilities.

[0050] When in the initial state, the decoder receives the output information from the encoder, which contains the feature representation of the input code snippet. At the same time, the decoder also receives a start token (such as <start>)as the initial input. Based on the output of the encoder and the start token, the decoder performs calculations through its own computational units (such as components like the multi-head attention mechanism, feed-forward neural network, etc.), combines the previously obtained predicted probability distribution, and obtains the predicted probability of the next token. Then, according to these probabilities, a token is selected as the annotation content generated at the current position. After selecting the token at the current position, the decoder uses this token as the input for the next prediction and simultaneously updates its internal state (such as the hidden state). Repeat the above steps until the decoder generates an end token (such as <end>), indicating that the annotation text generation is completed.

[0051] To select appropriate tokens from the predicted probability distribution to generate high-quality annotation text, a search algorithm can be employed. Exemplarily, greedy search selects the token with the highest predicted probability at each step as the output. Exemplarily, beam search retains k tokens with relatively high predicted probabilities at each step (k is called the beam width), and subsequent predictions are respectively made based on these k candidate tokens to form multiple candidate paths. After all paths are generated, the token sequence corresponding to the path with the highest probability product is selected as the final annotation text.

[0052] After the decoder generates the token sequence, post-processing operations are also required to optimize the annotation text. First is to remove special tokens, such as <start> 、 <end>And padding tokens added when converting text to tokens, etc. Secondly, perform grammar and semantic checks on the generated text. If there are obvious grammar errors or content that does not conform to the logic of code comments, corrections can be made through methods such as rule matching or language model scoring. Normalize some abbreviations, aliases, etc. that may affect understanding, unify the expressions, and improve the readability and accuracy of the comment text.

[0053] SS4. Determine the target code snippet through the mouse hover event, and use the code comment automatic generation model to generate comment text for the target code snippet. The specific steps are as follows.

[0054] SS4.1, Detect whether the comment automatic generation function is enabled.

[0055] This step confirms the status of the code comment automatic generation function, judges whether the function is in an available state, and decides whether to execute subsequent operations accordingly.

[0056] SS4.2, If so, listen for the mouse hover event.

[0057] When the comment automatic generation function is enabled, start the mouse hover event listening program to capture the user's mouse hover action in the code editor at any time. When the comment automatic generation function is not enabled, the mouse hover event is not listened for, and thus comments will not be automatically generated.

[0058] SS4.3, When the mouse hovers over a line of code, obtain the content of this line of code.

[0059] Once this step detects that the mouse hovers over a line of code, immediately extract the specific content of this line of code to prepare for determining the target code snippet later.

[0060] SS4.4, Determine the target code snippet according to the content of this line of code.

[0061] SS4.4.1, Detect whether the current line of code contains a call to a js event.

[0062] SS4.4.2, If not, use this line of code as the target code snippet.

[0063] SS4.4.3, If so, search for relevant code in the current page or other pages called according to the event name.

[0064] SS4.4.4, Use this line of code and the relevant code found as the target code snippet.

[0065] Check the code on this line to determine if there is any code related to calling JavaScript events. If no JavaScript event call is found in this line of code, directly identify this line of code as the target code snippet and stop searching for additional code. If this line of code contains a call to a JavaScript event, search for the associated code in the current code page and other relevant pages that may be called based on the event name. Integrate this line of code with the relevant code found by the event name to jointly form the target code snippet.

[0066] When the mouse hovers over a line of code, directly obtain the content of that line. This method can accurately focus on the code location that the user is currently interested in. In subsequent processing, if this line of code does not contain a call to a JS event, it will be used as the target code snippet to avoid analyzing irrelevant code. Comments can be generated around the code that the user actually views, and the generated comments can more accurately reflect the function and intention of this line of code, reducing comment deviation caused by an overly large analysis scope. If this line of code contains a call to a JavaScript event, search for the associated code in the current page and other relevant pages based on the event name, and integrate these codes with this line of code into the target code snippet to provide more complete context information for comment generation, because JavaScript events often involve interactions and collaborations between multiple code snippets. For example, a click event of a button may call other functions or modify the state of other elements. After including these related codes in the target code snippet, the model can generate more comprehensive and accurate comments.

[0067] In some alternative implementation manners, searching for the associated code in the current code page and other relevant pages that may be called based on the event name specifically includes the following steps: First, extract the JavaScript event name from the code on the line where the mouse hovers, such as click, change, submit, etc. This extraction can be completed through regular expressions or code parsing tools. First, search in the current HTML page. Specifically, in HTML, inline event handlers may be used. Traverse all HTML elements to check if there are inline event attributes that match the event name. In JavaScript code, the addEventListener or other event binding methods are usually used. Specifically, parse the JavaScript code to find all code snippets that use the addEventListener or similar methods to bind the specified event name. When searching in other relevant pages, first determine the relevant pages, including checking if there is <script>标签引入的外部JavaScript文件,记录这些文件的路径;检查是否存在通过<link>标签引入的CSS文件,虽然CSS文件本身不包含事件处理代码,但某些JavaScript代码可能会根据CSS类名或ID来绑定事件,因此需要关注这些关联;检查页面中是否存在通过AJAX或其他方式动态加载的代码。之后搜索相关页面,对于外部JavaScript文件,下载或读取这些文件的内容,并重复在当前页面中搜索JavaScript事件的步骤。将在当前页面和其他相关页面中搜索到的所有与事件名称关联的代码片段整合在一起,形成完整的目标代码片段。

[0068] SS4.5,调用代码注释自动生成模型,使用代码注释自动生成模型对目标代码片段生成注释文本。

[0069] 发送携带目标代码片段的HTTP请求,基于HTTP请求调取代码注释自动生成模型对目标代码片段生成注释文本;接收代码注释自动生成模型反馈的注释文本。即将目标代码片段通过HTTP请求发送给后端,由后端调用代码注释自动生成模型进行注释生成操作,等待后端返回生成的注释文本并接收。

[0070] 在一些可选的实施方式中,接收到注释文本后,检测当前代码技术架构;将注释文本转换为与当前代码技术架构适配的注释文本格式;以弹窗形式在人机交互界面展示注释文本内容。

[0071] 具体地,下载vscode前端开发软件,使用nvm(nodeJs版本管理器)安装node环境,开发需要Node.js环境,开发需要Node.js环境。

[0072] 安装脚手架,使用Yeoman这个Web应用程序的脚手架工具,用结构化的方式来组织代码和文件,来创建智能化代码注释插件项目,利用Yeoman的一个生成器generator-code,创建和管理VisualStudioCode扩展,使用"YoCode"命令来生成VSCode扩展的基本结构,在此基础上进行开发。

[0073] 生成的目录结构extension.ts文件用来编写智能化代码注释插件代码,插件激活时调用active方法,设置鼠标悬浮在某一行代码时,获取本行代码的内容,向前端代码模型训练发送HTTP请求,返回其中的关键字的注释内容,当代码中含有调用js事件时,根据事件名称,在本页面或者调用的其他页面内寻找来源并且对相应代码注释,查找css样式,根据class的名称去搜索,展示相关属性的解释,追本溯源生成连贯、有逻辑的注释文本,然后以弹窗的形式展示注释内容,根据HTML、CSS、JavaScript不同情况下的注释格式,生成相应代码下的注释,可以设置快捷键,一键生成。根据关键字查找相应注释,Css的属性前缀带有class,style,js事件属性带有click,change。

[0074] 例如<divclass=’thisClass’onClick=‘clickThis’>去<style>标签查找对应的样式,如字号font-size,字体颜色color,背景background,onClick是点击事件,去<script>标签查找对应的方法名clickThis,functionclickThis(){alert(1)},根据里面的关键字,得到相应注释,弹出框展示1,整个注释为行级标签div,css名字为thisClass(css对应属性),点击这个div页面弹出框展示1。

[0075] 代码编写完成后开启监听,将ts转为js代码,切换到调试面板,点击顶部绿色箭头运行插件,vscode会打开一个新的窗口,该窗口运行了我们所编写的插件,新窗口打开后等待一会,旧窗口会有日志输出,验证无误后进行打包,打包出的文件拓展名为vsix,直接拖到拓展面板中即可安装,或者在菜单中选择安装。

[0076] 上文中对于一种代码注释自动生成方法的实施例进行了详细描述,基于上述实施例描述的代码注释自动生成方法,本发明实施例还提供了一种与该方法对应的代码注释自动生成系统。

[0077] 图2为本发明实施例提供的一种代码注释自动生成系统结构示意框图,本实施例中,代码注释自动生成系统200根据其所执行的功能,可以被划分为多个功能模块,如图2所示。所述功能模块可以包括:数据收集模块210、数据集构建模块220、模型训练模块230、注释生成模块240。本发明所称的模块是指一种能够被至少一个处理器所执行并且能够完成固定功能的一系列计算机程序段,其存储在存储器中。

[0078] 数据收集模块210,用于收集前端开发的若干代码片段,并为各个代码片段标注注释样本。

[0079] 数据集构建模块220,用于将若干代码片段及其注释样本构建为数据集。

[0080] 模型训练模块230,用于使用数据集对预先构建的代码注释自动生成模型进行训练。

[0081] 注释生成模块240,用于使用代码注释自动生成模型对目标代码片段生成注释文本。

[0082] 在一些可选的实施方式中,注释生成模块240使用代码注释自动生成模型对目标代码片段生成注释文本,具体包括:检测注释自动生成功能是否开启;若是,对鼠标悬浮事件进行监听;当鼠标悬浮在某一行代码时,获取本行代码内容;根据本行代码内容确定目标代码片段;调用代码注释自动生成模型,使用代码注释自动生成模型对目标代码片段生成注释文本。

[0083] 在一些可选的实施方式中,根据本行代码内容确定目标代码片段,具体包括:检测本行代码中是否包含调用js事件;若否,将本行代码作为目标代码片段;若是,根据事件名称在当前页面或调用的其他页面内寻找相关代码;将本行代码及所寻找的相关代码作为目标代码片段。

[0084] 在一些可选的实施方式中,注释生成模块240使用代码注释自动生成模型对目标代码片段生成注释文本,具体包括:发送携带目标代码片段的HTTP请求,基于HTTP请求调取代码注释自动生成模型对目标代码片段生成注释文本;接收代码注释自动生成模型反馈的注释文本。

[0085] 在一些可选的实施方式中,注释生成模块240还用于检测当前代码技术架构;将注释文本转换为与当前代码技术架构适配的注释文本格式;以弹窗形式在人机交互界面展示注释文本内容。

[0086] 在一些可选的实施方式中,代码注释自动生成模型为Transformer架构,包括词嵌入层、多个编码器层、一个线性层、softmax函数、解码器、后处理模块;词嵌入层将输入文本转换为向量表示,向量表示经过多个编码器层进行特征提取,将提取的特征通过一个线性层和softmax函数得到预测概率分布,解码器根据编码器输出和预测概率分布生成预测输出样本,后处理模块将预测输出样本转换为预测注释样本。

[0087] 在一些可选的实施方式中,模型训练模块230使用数据集对预先构建的代码注释自动生成模型进行训练时,将代码片段转换为令牌序列作为输入文本;代码注释自动生成模型的预测输出样本为令牌序列形式。

[0088] 本实施例的代码注释自动生成系统用于实现前述的代码注释自动生成方法,因此该系统中的具体实施方式可见前文中的代码注释自动生成方法的实施例部分,所以,其具体实施方式可以参照相应的各个部分实施例的描述,在此不再展开介绍。

[0089] 另外,由于本实施例的代码注释自动生成系统用于实现前述的代码注释自动生成方法,因此其作用与上述方法的作用相对应,这里不再赘述。

[0090] 图3为本发明实施例提供的一种终端300的结构示意图,包括:处理器310、存储器320及通信单元330。所述处理器310用于实现存储器320中保存的代码注释自动生成程序时实现以下步骤:收集前端开发的若干代码片段,并为各个代码片段标注注释样本;将若干代码片段及其注释样本构建为数据集;使用数据集对预先构建的代码注释自动生成模型进行训练;使用代码注释自动生成模型对目标代码片段生成注释文本。

[0091] 该终端300包括处理器310、存储器320及通信单元330。这些组件通过一条或多条总线进行通信,本领域技术人员可以理解,图中示出的服务器的结构并不构成对本发明的限定,它既可以是总线形结构,也可以是星型结构,还可以包括比图示更多或更少的部件,或者组合某些部件,或者不同的部件布置。

[0092] 其中,该存储器320可以用于存储处理器310的执行指令,存储器320可以由任何类型的易失性或非易失性存储终端或者它们的组合实现,如静态随机存取存储器(SRAM),电可擦除可编程只读存储器(EEPROM),可擦除可编程只读存储器(EPROM),可编程只读存储器(PROM),只读存储器(ROM),磁存储器,快闪存储器,磁盘或光盘。当存储器320中的执行指令由处理器310执行时,使得终端300能够执行以下上述方法实施例中的部分或全部步骤。

[0093] 处理器310为存储终端的控制中心,利用各种接口和线路连接整个电子终端的各个部分,通过运行或执行存储在存储器320内的软件程序和 / 或模块,以及调用存储在存储器内的数据,以执行电子终端的各种功能和 / 或处理数据。所述处理器可以由集成电路(IntegratedCircuit,简称IC)组成,例如可以由单颗封装的IC所组成,也可以由连接多颗相同功能或不同功能的封装IC而组成。举例来说,处理器310可以仅包括中央处理器(CentralProcessingUnit,简称CPU)。在本发明实施方式中,CPU可以是单运算核心,也可以包括多运算核心。

[0094] 通信单元330,用于建立通信信道,从而使所述存储终端可以与其它终端进行通信。接收其他终端发送的用户数据或者向其他终端发送用户数据。

[0095] 本发明还提供一种计算机存储介质,这里所说的存储介质可为磁碟、光盘、只读存储记忆体(英文:read-onlymemory,简称:ROM)或随机存储记忆体(英文:randomaccessmemory,简称:RAM)等。

[0096] 本发明还提供一种计算机存储介质,这里所说的存储介质可为磁碟、光盘、只读存储记忆体(英文:read-onlymemory,简称:ROM)或随机存储记忆体(英文:randomaccessmemory,简称:RAM)等。

[0097] 计算机存储介质存储有代码注释自动生成程序,代码注释自动生成程序被处理器执行时实现以下步骤:收集前端开发的若干代码片段,并为各个代码片段标注注释样本;将若干代码片段及其注释样本构建为数据集;使用数据集对预先构建的代码注释自动生成模型进行训练;使用代码注释自动生成模型对目标代码片段生成注释文本。

[0098] 本领域的技术人员可以清楚地了解到本发明实施例中的技术可借助软件加必需的通用硬件平台的方式来实现。基于这样的理解,本发明实施例中的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质中如U盘、移动硬盘、只读存储器(ROM,Read-OnlyMemory)、随机存取存储器(RAM,RandomAccessMemory)、磁碟或者光盘等各种可以存储程序代码的介质,包括若干指令用以使得一台计算机终端(可以是个人计算机,服务器,或者第二终端、网络终端等)执行本发明各个实施例所述方法的全部或部分步骤。

[0099] 在本发明所提供的几个实施例中,应该理解到,所揭露的系统、装置和方法,可以通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的,例如,所述单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个系统,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口,装置或单元的间接耦合或通信连接,可以是电性,机械或其它的形式。

[0100] 所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。

[0101] 另外,在本发明各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。

[0102] 对所公开的实施例的上述说明,使本领域专业技术人员能够实现或使用本发明。对这些实施例的多种修改对本领域的专业技术人员来说将是显而易见的,本文中所定义的一般原理可以在不脱离本发明的精神或范围的情况下,在其它实施例中实现。因此,本发明将不会被限制于本文所示的这些实施例,而是要符合与本文所公开的原理和新颖特点相一致的最宽的范围。< / script> < / end> < / start> < / end> < / start>

Claims

1. A method for automatically generating code comments, characterized in that It includes the following steps: Collect several code snippets for front-end development and label annotation samples for each code snippet; Construct a dataset from several code snippets and their annotation samples; Use the dataset to train a pre-constructed automatic code annotation generation model; Determine the target code snippet through a mouse hover event, and use the automatic code annotation generation model to generate annotation text for the target code snippet.

2. The method for automatically generating code comments according to claim 1, wherein Using the automatic code annotation generation model to generate annotation text for the target code snippet specifically includes: Detect whether the automatic annotation generation function is enabled; If so, listen for mouse hover events; When the mouse hovers over a line of code, obtain the content of this line of code; Determine the target code snippet based on the content of this line of code; Call the automatic code annotation generation model and use the automatic code annotation generation model to generate annotation text for the target code snippet.

3. The method for automatically generating code comments according to claim 2, characterized in that, Determining the target code snippet based on the content of this line of code specifically includes: Detect whether the current line of code contains a call to a js event; If not, use this line of code as the target code snippet; If so, search for relevant code in the current page or other called pages according to the event name; Use this line of code and the found relevant code as the target code snippet.

4. The method for automatically generating code comments according to any one of claims 1 to 3, characterized in that, Using the automatic code annotation generation model to generate annotation text for the target code snippet specifically includes: Send an HTTP request carrying the target code snippet, and based on the HTTP request, call the automatic code annotation generation model to generate annotation text for the target code snippet; Receive the annotation text feedback by the automatic code annotation generation model.

5. The method for automatically generating code comments according to claim 4, wherein, This method further includes the following steps: Detect the current code technology architecture; Convert the annotation text into an annotation text format adapted to the current code technology architecture; Display the content of the annotation text in a pop-up window on the human-computer interaction interface.

6. The method for automatically generating code comments according to claim 1, wherein The automatic code annotation generation model is of the Transformer architecture, including a word embedding layer, multiple encoder layers, a linear layer, a softmax function, a decoder, and a post-processing module; The word embedding layer converts the input text into a vector representation. The vector representation undergoes feature extraction through multiple encoder layers. The extracted features pass through a linear layer and a softmax function to obtain a predicted probability distribution. The decoder generates a predicted output sample based on the encoder output and the predicted probability distribution, and the post-processing module converts the predicted output sample into a predicted annotation sample.

7. The method for automatically generating code comments according to claim 6, characterized in that, When using the dataset to train a pre-constructed automatic code annotation generation model, convert the code snippet into a token sequence as the input text; the predicted output sample of the automatic code annotation generation model is in the form of a token sequence.

8. An automatic code comment generation system, characterized in that, It includes: A data collection module for collecting several code snippets for front-end development and labeling annotation samples for each code snippet; A dataset construction module for constructing a dataset from several code snippets and their annotation samples; A model training module for using the dataset to train a pre-constructed automatic code annotation generation model; An annotation generation module for determining the target code snippet through a mouse hover event and using the automatic code annotation generation model to generate annotation text for the target code snippet.

9. A terminal, characterized in that, It includes: A memory for storing the automatic code annotation generation program; A processor for implementing the steps of the code comment automatic generation method according to any one of claims 1 to 7 when executing the code comment automatic generation program.

10. A computer-readable storage medium, characterized in that, A code comment automatic generation program is stored on the readable storage medium, and when the code comment automatic generation program is executed by a processor, the steps of the code comment automatic generation method according to any one of claims 1 to 7 are implemented.