CN114936111A

CN114936111A - 前端变量异常检测及修复方法、装置、设备及存储介质

Info

Publication number: CN114936111A
Application number: CN202210647386.XA
Authority: CN
Inventors: 黄康
Original assignee: Ping An Technology Shenzhen Co Ltd
Current assignee: Ping An Technology Shenzhen Co Ltd
Priority date: 2022-06-08
Filing date: 2022-06-08
Publication date: 2022-08-23

Abstract

本发明涉及人工智能技术，揭露了一种前端变量异常检测及修复方法，包括：构建前端项目的变量异常检测及修复项目，根据所述变量异常检测及修复项目从所述前端项目中查找出待修复组件，识别所述待修复组件中的异常变量，以及识别所述异常变量的变量值类型，对变量值类型识别为数字类型的异常变量进行累计操作删除处理，对变量值类型识别为数组类型的异常变量进行数组转化处理，对变量值类型识别为对象类型的异常变量进行属性扩展处理。此外，本发明还涉及区块链技术，所述前端项目可从区块链的节点中获取。本发明还提出一种前端变量异常检测及修复装置、电子设备以及可读存储介质。本发明可以解决变量异常检测及修复效率较低的问题。

Description

前端变量异常检测及修复方法、装置、设备及存储介质

技术领域

本发明涉及人工智能技术领域，尤其涉及一种前端变量异常检测及修复方法、装置、电子设备及可读存储介质。

背景技术

目前前端开发过程中，主流的框架主要是vue和react，国内中小型公司主要以vue框架为主，原因是vue框架上手较为简单，容易入门快速开发。而react框架入门需要学习更多的框架基础知识，设计思想更加超前，所以主要活跃与中大型公司的项目中。在react框架开发过程中，通过对变量的修改从而触发视图更新这部分代码的编写方式，与vue框架的方式有明显的差异，主要体现在对于数组、对象的处理上，vue框架对于变量的设置可以直接通过添加、删除、插入等操作直接修改原来的变量。而react框架则采用纯函数式编程的理念，对于变量设置，不能够直接进行添加、删除、插入等会影响到原数据本身的操作，且需要通过框架独有的设置变量的方法进行设置。这对于很多开发者来说，特别是同时开发vue和react框架项目，或从vue框架项目转向开发react框架项目的开发者来说，是非常容易采用固有的思想去编写react变量设置的代码，而且通过错误代码编写过程中，由于控制台并不会报错，且没有异常警告提醒，在部分场景下功能都还能够保持正常。所以，经常会出现因为在react框架内变量设置不规范的书写方式，导致最终发布到生产上，出现功能异常的情况。

目前对于这个问题的解决方案，主要还是停留在加大对开发人员的技能培训方面，或者事后人工进行变量排查修复，这不仅需要开发者投入一定的精力去时刻记住编码规范，而且变量检测及修复的效率也较低。

发明内容

本发明提供一种前端变量异常检测及修复方法、装置、电子设备及可读存储介质，其主要目的在于解决变量异常检测及修复效率较低的问题。

为实现上述目的，本发明提供的一种前端变量异常检测及修复方法，包括：

构建前端项目的变量异常检测及修复项目，根据所述变量异常检测及修复项目从所述前端项目中查找出待修复组件；

识别所述待修复组件中的异常变量，以及识别所述异常变量的变量值类型；

对变量值类型识别为数字类型的异常变量进行累计操作删除处理；

对变量值类型识别为数组类型的异常变量进行数组转化处理；

对变量值类型识别为对象类型的异常变量进行属性扩展处理。

可选地，所述构建前端项目的变量异常检测及修复项目，包括：

定位所述前端项目的根目录，在所述根目录中添加变量异常检测及修复工具；

在所述变量异常检测及修复工具中设置检测配置文件，并在添加完检测配置文件的根目录中添加组件修复命令，执行所述组件修复命令，得到所述变量异常检测及修复项目。

可选地，所述根据所述变量异常检测及修复项目从所述前端项目中查找出待修复组件，包括：

根据所述变量异常检测及修复项目遍历所述前端项目的项目目录；

从遍历到的项目目录中查找出包含预设后缀的文件作为目标文件集合；

利用预设的多轮关键词检索方法提取所述目标文件集合中的待修复组件。

可选地，所述利用预设的多轮关键词检索方法提取所述目标文件集合中的待修复组件，包括：

逐一遍历所述目标文件集合中的目标文件，查找遍历到的目标文件中是否包含预设的引入关键词；

若所述目标文件中不包含所述引入关键词，则返回所述逐一遍历所述目标文件集合中的目标文件的步骤；

若所述目标文件中包含所述引入关键词，查找所述目标文件中是否包含预设的申明关键词；

若所述目标文件中不包含预设的申明关键词，返回所述逐一遍历所述目标文件集合中的目标文件的步骤；

若所述目标文件中包含所述申明关键词，查找所述目标文件中是否包含预设的变量设置关键词；

若所述目标文件中不包含所述变量设置关键词，返回所述逐一遍历所述目标文件集合中的目标文件的步骤；

若所述目标文件中包含所述变量设置关键词，确定当前的目标文件为所述待修复组件，并返回所述逐一遍历所述目标文件集合中的目标文件的步骤，直至遍历完所述目标文件集合中的目标文件。

可选地，所述识别所述待修复组件中的异常变量，包括：

提取所述待修复组件中的变量容器；

确定所述变量容器中被重新设置的变量为所述异常变量。

可选地，所述对变量值类型识别为数组类型的异常变量进行数组转化处理，包括：

识别出数组类型的异常变量的数组调用方法并删除；

在删除后的异常变量中设置预设的数组替换方法。

可选地，所述对变量值类型识别为对象类型的异常变量进行属性扩展处理，包括：

判断对象类型的异常变量是否存在对象直接添加属性操作；

若对象类型的异常变量不存在对象直接添加属性操作，则对所述异常变量不作处理；

若对象类型的异常变量存在对象直接添加属性操作，则构建空对象，将需要添加的属性添加至所述空对象中，并对添加完属性的空对象进行对象合并处理。

为了解决上述问题，本发明还提供一种前端变量异常检测及修复装置，所述装置包括：

检测修复项目构建模块，用于构建前端项目的变量异常检测及修复项目，根据所述变量异常检测及修复项目从所述前端项目中查找出待修复组件；

变量异常检测模块，用于识别所述待修复组件中的异常变量，以及识别所述异常变量的变量值类型；

异常变量修复模块，用于对变量值类型识别为数字类型的异常变量进行累计操作删除处理，对变量值类型识别为数组类型的异常变量进行数组转化处理，对变量值类型识别为对象类型的异常变量进行属性扩展处理。

为了解决上述问题，本发明还提供一种电子设备，所述电子设备包括：

存储器，存储至少一个计算机程序；及

处理器，执行所述存储器中存储的计算机程序以实现上述所述的前端变量异常检测及修复方法。

为了解决上述问题，本发明还提供一种计算机可读存储介质，所述计算机可读存储介质中存储有至少一个计算机程序，所述至少一个计算机程序被电子设备中的处理器执行以实现上述所述的前端变量异常检测及修复方法。

本发明通过直接在前端项目中构建异常检测及修复项目，只需要将此异常检测及修复项目引入到当前前端项目中，就会自动分析识别出所有开发文件中的异常变量，并根据异常变量的类型进行相应修复处理。同时，由于是对前端项目自动的去识别异常变量及修复，不仅不要求开发掌握相关的知识和技术，还节省了人工排查异常变量及修复所花费的时间精力，也避免了人工排查过程中，可能出现遗漏的场景，大大提高了变量异常检测及修复的效率。因此本发明提出的前端变量异常检测及修复方法、装置、电子设备及计算机可读存储介质，可以解决变量异常检测及修复效率较低的问题。

附图说明

图1为本发明一实施例提供的前端变量异常检测及修复方法的流程示意图；

图2为图1中其中一个步骤的详细实施流程示意图；

图3为图1中另一个步骤的详细实施流程示意图；

图4为图1中另一个步骤的详细实施流程示意图；

图5为图1中另一个步骤的详细实施流程示意图；

图6为本发明一实施例提供的前端变量异常检测及修复装置的功能模块图；

图7为本发明一实施例提供的实现所述前端变量异常检测及修复方法的电子设备的结构示意图。

本发明目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。

具体实施方式

应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。

本发明实施例提供一种前端变量异常检测及修复方法。所述前端变量异常检测及修复方法的执行主体包括但不限于服务端、终端等能够被配置为执行本发明实施例提供的该方法的电子设备中的至少一种。换言之，所述前端变量异常检测及修复方法可以由安装在终端设备或服务端设备的软件或硬件来执行，所述软件可以是区块链平台。所述服务端包括但不限于：单台服务器、服务器集群、云端服务器或云端服务器集群等。所述服务器可以是独立的服务器，也可以是提供云服务、云数据库、云计算、云函数、云存储、网络服务、云通信、中间件服务、域名服务、安全服务、内容分发网络(ContentDelivery Network，CDN)、以及大数据和人工智能平台等基础云计算服务的云服务器。

参照图1所示，为本发明一实施例提供的前端变量异常检测及修复方法的流程示意图。在本实施例中，所述前端变量异常检测及修复方法包括以下步骤S1-S5：

S1、构建前端项目的变量异常检测及修复项目，根据所述变量异常检测及修复项目从所述前端项目中查找出待修复组件。

本发明实施例中，所述前端项目是指通过HTML，CSS及JavaScript以及衍生出来的各种技术、框架、解决方案，来实现互联网产品的用户界面交互的项目，例如，XXapp开发项目、XX公司官网开发项目、XX产品页面开发项目、XX小程序开发项目等。

详细地，参照图2所示，所述构建前端项目的变量异常检测及修复项目，包括以下步骤S10-S11：

S10、定位所述前端项目的根目录，在所述根目录中添加变量异常检测及修复工具；

S11、在所述变量异常检测及修复工具中设置检测配置文件，并在添加完检测配置文件的根目录中添加组件修复命令，执行所述组件修复命令，得到所述变量异常检测及修复项目。

本发明实施例中，所述变量异常检测及修复项目用来在前端页面中执行下述S2至S5的步骤来对react框架的Class组件中的变量设置进行异常检测及修复。例如，在命令行(mac系统为终端)，定位当前前端项目根目录，执行命令：npmisetState-scan-repair-tools-D，则可以添加变量异常检测及修复工具到当前框架项目中，设置检测配置文件config.js，在检测配置文件中添加组件优化命令：npm run scan-and-repair并执行，得到变量异常检测及修复项目，其中，检测配置文件中的配置内容包括：当前开发文件所在目录地址等。

详细地，所述根据所述变量异常检测及修复项目从所述前端项目中查找出待修复组件，包括：

本发明一可选实施例中，根据变量异常检测及修复项目中检测配置文件config.js中所配置的配置项：当前开发文件所在目录地址，遍历前端项目的项目目录，从项目开发文件所在目录中查找组件目录，将包括后缀.js结尾的地址的文件作为所述目标文件集合。

本发明一可选实施例中，所述变量异常检测及修复项目用于对react框架编写的class组件进行变量异常检测及修复。

详细地，所述利用预设的多轮关键词检索方法提取所述目标文件集合中的待修复组件，包括：

本发明一可选实施例中，由于变量设置只会出现在react编写的class组件内，而class组件也是通过.js文件结尾的，所以需要将class组件通过以下几个步骤识别出来：

1.1、判断遍历到的当前目标文件最开始的代码中，是否存在通过import关键字(引入关键词)，将react库引入到当前文件中，例如import React from'react'。如果不存在，则说明该文件不属于react组件，直接进行下一个.js结尾文件的判断，直到所有.js结尾文件都判断完成，如果存在，则进行1.2步骤判断；

1.2、判断当前目标文件内，是否存在通过class关键字(申明关键词)，进行申明一个类，并且该类继承于react框架的Component组件类，例如class A extendsReact.component{组件声明内容}，其中A即为声明的组件名称，React.component即为react框架的Component组件类。如果不存在，则说明该文件并不是一个class组件声明的文件，直接进行下一个.js结尾文件的判断，直到所有.js结尾文件都判断完成，如果存在，则说明当前文件属于一个class组件，需要进行1.3步骤判断是否有进行变量的使用。

1.3、判断当前目标文件内对于组件的声明中的内容(即1.2步骤所举例子中花括号内所包裹的组件声明内容)，其内部的代码中，所包含初始化执行的constructor函数内，是否存在通过this关键字(变量设置关键词)，进行变量的初始化设置，如this.state＝{变量初始设置内容}，其中state是所有react框架class组件存放当前组件变量的容器。如果不存在，则说明当前的组件没有使用到变量，直接进行下一个.js结尾文件的判断，直到所有.js结尾文件都判断完成，如果存在则说明当前组件存在变量的使用，则需要进行1.4步骤判断是否存在初始化之后对于变量的再次设置操作；

1.4、在当前文件内组件声明的内容中，查找是否存在关键字setState，如果存在，则说明当前组件中，存在对变量初始化之后，对于变量进行再次设置操作，符合本发明的扫描条件，确定为待修复组件。如果不存在，直接进行下一个.js结尾文件的判断，直到所有.js结尾文件都判断完成。

S2、识别所述待修复组件中的异常变量，以及识别所述异常变量的变量值类型。

本发明实施例中，对于不符合规范的异常变量往往出现在被重新设置的变量，因此需要进行进一步识别异常变量。

具体地，参照图3所示，所述识别所述待修复组件中的异常变量，包括以下步骤S20-S21：

S20、提取所述待修复组件中的变量容器；

S21、确定所述变量容器中被重新设置的变量为所述异常变量。

本发明一可选实施例中，通过获取当前文件内定义组件变量容器，即1.3步骤中state对象。遍历该对象内的每一个变量，查找是否存在通过调用setState方法，并在传入的对象参数中包含当前遍历获取的单个变量。例如：当前处理的变量，变量名为A，且存在通过语句如this.setState({变量A：变量A新的值})，表示对变量A进行重新赋值为变量A新的值，则说明该变量有被重新设置的情况，将被重新设置的变量确定为异常变量。

本发明一可选实施例中，对于不符合规范的异常变量，可以通过Object.prototype.toString方法判断该异常变量变量值的数据类型，主要包括三种，分别是数字、数组及对象类型。

S3、对变量值类型识别为数字类型的异常变量进行累计操作删除处理。

本发明实施例中，对于变量的值类型属于数字的类型，首先判断设置变量新的值，是否为变量其变量本身，如this.state.变量A，则需要在调用setState方法的前面代码中，查找是否存在通过操作运算符累加、累减进行变量修改操作的行为。例如this.state.变量A++，表示直接对变量A进行累加操作；this.state.变量A--，表示直接对变量A进行累加操作。这两种情况是不被允许的，因为会直接修改到变量本身，后续在通过setState方法进行处理时，框架对于前后值的对比会出现一致的情况，最终导致组件不刷新，页面展示异常，因此需要进行异常变量修复。

其中，在数字类型的异常变量修复，在调用setState方法时，通过设置新的变量的值的代码，从直接引用其值本身，变更为其值本身加1或者减1(根据使用的是累加还是累减运算符决定)。如，变量A新的值设置应该从this.state.变量A，变更为this.state.变量A+1或this.state.变量A-1。并且将在调用setState方法的前面代码中，对于变量直接进行累加或者累减操作的整行语句删除。

S4、对变量值类型识别为数组类型的异常变量进行数组转化处理。

本发明实施例中，由于数组可以使用多种方法进行元素调用，包括：push方法、pop方法、unshift方法及shift方法，因此需要对不同数组调用方法进行相应的数组转化。

进一步地，参照图4所示，所述对变量值类型识别为数组类型的异常变量进行数组转化处理，包括以下步骤S40-S41：

S40、识别出数组类型的异常变量的数组调用方法并删除；

S41、在删除后的异常变量中设置预设的数组替换方法。

本发明一可选实施例中，对于使用push方法的情况：

4.11、判断设置变量新的值，是否使用了给数组追加数组内元素的push方法，如this.setState({数组B：数组B.push(新元素C))，表示为数组类型的数组B，追加一个新元素C。由于push方法的使用，会直接改变原来的数组B，这会导致执行setState方法需要连带触发组件内容更新时，发现数组B的数据前后是没有变化的，会被react框架底层判定为没有变化产生，最终导致组件的视图没有更新；

4.12、对于原来使用push方法的代码，首先提取出调用push方法时传入的入参，然后将原本调用push方法的代码删除，替换为使用concat方法，并将提取出来的入参传入。如数组B.push(新元素C)，需要变更为数组B.concat(新元素C)。

对于使用pop方法的情况：

4.21、判断设置变量新的值，是否为变量其变量本身。如this.state.数组D，则需要在调用setState方法的前面代码中，判断是否有使用pop方法进行删除数组的最后一个元素操作。例如this.state.数组D.pop()，表示删除数组D的最后一个元素。由于pop方法的使用，会直接改变原来数组D，这会导致执行setState方法需要连带触发组件内容更新时，发现数组D的数据前后是没有变化的，会被react框架底层判定为没有变化产生，最终导致组件的视图没有更新；

4.22、通过将原来使用pop方法的代码，进行删除操作，然后在调用setState方法时，设置新的变量的值的代码，从直接引用其值本身，变更为使用slice方法截取第1个到倒数第二个元素的操作，例如this.setState({数组D：this.state.数组D.pop())，变更为this.setState({数组D：this.state.数组D.slice(0，-1))。

对于使用unshift方法的情况：

4.31、判断设置变量新的值，是否为变量其变量本身，如this.state.数组E，则需要在调用setState方法的前面代码中，判断是否有使用unshift方法为数组的开头添加一个元素操作。例如this.state.数组E.unshift(元素F)，表示为数组E的开头添加一个元素F。由于unshift方法的使用，会直接改变原来数组E，这会导致执行setState方法需要连带触发组件内容更新时，发现数组E的数据前后是没有变化的，会被react框架底层判定为没有变化产生，最终导致组件的视图没有更新；

4.32、首先提取出调用unshift方法时传入的入参，并放入一个新建的空数组G中，然后将原本调用unshift方法的代码删除，替换为数组G调用concat方法，并将数组E作为入参传入。如this.setState({数组E：this.state.数组E.unshift(元素F))，变更为this.setState({数组E：数组G.concat.(数组E)})。

对于使用shift方法的情况：

4.41、判断设置变量新的值，是否为变量其变量本身。如this.state.数组H，则需要在调用setState方法的前面代码中，判断是否有使用shift方法为数组的开头删除一个元素操作。例如this.state.数组H.shift()，表示为数组H的删除开头的一个。由于shift方法的使用，会直接改变原来数组H，这会导致执行setState方法需要连带触发组件内容更新时，发现数组H的数据前后是没有变化的，会被react框架底层判定为没有变化产生，最终导致组件的视图没有更新；

4.42、通过将原来使用shift方法的代码，进行删除操作，然后在调用setState方法时，设置新的变量的值的代码，从直接引用其值本身，例如this.setState({数组H：this.state.数组H.shift())，变更为this.setState({数组H：this.state.数组H.slice(1))。

S5、对变量值类型识别为对象类型的异常变量进行属性扩展处理。

详细地，参照图5所示，所述对变量值类型识别为对象类型的异常变量进行属性扩展处理，包括以下步骤S50-S52：

S50、判断对象类型的异常变量是否存在对象直接添加属性操作；

S51、若对象类型的异常变量不存在对象直接添加属性操作，则对所述异常变量不作处理；

S52、若对象类型的异常变量存在对象直接添加属性操作，则构建空对象，将需要添加的属性添加至所述空对象中，并对添加完属性的空对象进行对象合并处理。

本发明一可选实施例中，对于变量的值类型属于对象的场景：

5.1、判断设置变量新的值，是否为变量其变量本身。如this.state.对象J，则需要在调用setState方法的前面代码中，判断是否有直接在对象上添加属性的操作。例如this.state.对象J.属性A＝111，表示在对象J上添加属性A，并设置属性A的值为111。这种直接在对象上添加属性的方式，会改变原来对象，这会导致执行setState方法需要连带触发组件内容更新时，发现对象J的数据前后是没有变化的，会被react框架底层判定为没有变化产生，最终导致组件的视图没有更新；

5.2、创建一个空对象，将需要添加的属性(即5.1中的属性A)，放置到这个空对象内，如{属性A：111}

5.3、在调用setState方法时，设置新的变量的值的代码，从直接引用其值本身，变更为使用Object.assign方法，调用该方法时，需要传入三个参数，第一个参数为一个空对象，表示新建了对象；第二个参数为需要扩展属性的对象本身，即例子中的对象J；第三个参数为5.2步骤中创建的对象。这个方式等同于将新建一个空对象、需要扩展属性的对象和只包含扩展属性的对象，三者做合并成一个新的对象，这样就不会出现在为对象添加属性时，修改到原对象本身。

本发明另一可选实施例中，对于检查到异常的文件并做出修复后，会在控制台中打印出具体哪些文件，在第几行代码中，工具进行了自动修复操作，方便开发者后续进行排查，以及提醒开发者后续应该避免再出现此类语法错误使用的问题，提高开发效率。

本发明通过直接在前端项目中构建异常检测及修复项目，只需要将此异常检测及修复项目引入到当前前端项目中，就会自动分析识别出所有开发文件中的异常变量，并根据异常变量的类型进行相应修复处理。同时，由于是对前端项目自动的去识别异常变量及修复，不仅不要求开发掌握相关的知识和技术，还节省了人工排查异常变量及修复所花费的时间精力，也避免了人工排查过程中，可能出现遗漏的场景，大大提高了变量异常检测及修复的效率。因此本发明提出的前端变量异常检测及修复方法，可以解决变量异常检测及修复效率较低的问题。

如图6所示，是本发明一实施例提供的前端变量异常检测及修复装置的功能模块图。

本发明所述前端变量异常检测及修复装置100可以安装于电子设备中。根据实现的功能，所述前端变量异常检测及修复装置100可以包括检测修复项目构建模块101、变量异常检测模块102及异常变量修复模块103。本发明所述模块也可以称之为单元，是指一种能够被电子设备处理器所执行，并且能够完成固定功能的一系列计算机程序段，其存储在电子设备的存储器中。

在本实施例中，关于各模块/单元的功能如下：

所述检测修复项目构建模块101，用于构建前端项目的变量异常检测及修复项目，根据所述变量异常检测及修复项目从所述前端项目中查找出待修复组件；

所述变量异常检测模块102，用于识别所述待修复组件中的异常变量，以及识别所述异常变量的变量值类型；

所述异常变量修复模块103，用于对变量值类型识别为数字类型的异常变量进行累计操作删除处理，对变量值类型识别为数组类型的异常变量进行数组转化处理，对变量值类型识别为对象类型的异常变量进行属性扩展处理。

详细地，所述前端变量异常检测及修复装置100各模块的具体实施方式如下：

步骤一、构建前端项目的变量异常检测及修复项目，根据所述变量异常检测及修复项目从所述前端项目中查找出待修复组件。

详细地，所述构建前端项目的变量异常检测及修复项目，包括：

本发明实施例中，所述变量异常检测及修复项目用来在前端页面中执行下述的步骤来对react框架的Class组件中的变量设置进行异常检测及修复。例如，在命令行(mac系统为终端)，定位当前前端项目根目录，执行命令：npmisetState-scan-repair-tools-D，则可以添加变量异常检测及修复工具到当前框架项目中，设置检测配置文件config.js，在检测配置文件中添加组件优化命令：npm run scan-and-repair并执行，得到变量异常检测及修复项目，其中，检测配置文件中的配置内容包括：当前开发文件所在目录地址等。

步骤二、识别所述待修复组件中的异常变量，以及识别所述异常变量的变量值类型。

具体地，所述识别所述待修复组件中的异常变量，包括以下步骤S20-S21：

提取所述待修复组件中的变量容器；

确定所述变量容器中被重新设置的变量为所述异常变量。

步骤三、对变量值类型识别为数字类型的异常变量进行累计操作删除处理。

步骤四、对变量值类型识别为数组类型的异常变量进行数组转化处理。

进一步地，所述对变量值类型识别为数组类型的异常变量进行数组转化处理，包括：

识别出数组类型的异常变量的数组调用方法并删除；

在删除后的异常变量中设置预设的数组替换方法。

本发明一可选实施例中，对于使用push方法的情况：

对于使用pop方法的情况：

对于使用unshift方法的情况：

对于使用shift方法的情况：

步骤五、对变量值类型识别为对象类型的异常变量进行属性扩展处理。

详细地，所述对变量值类型识别为对象类型的异常变量进行属性扩展处理，包括：

判断对象类型的异常变量是否存在对象直接添加属性操作；

本发明通过直接在前端项目中构建异常检测及修复项目，只需要将此异常检测及修复项目引入到当前前端项目中，就会自动分析识别出所有开发文件中的异常变量，并根据异常变量的类型进行相应修复处理。同时，由于是对前端项目自动的去识别异常变量及修复，不仅不要求开发掌握相关的知识和技术，还节省了人工排查异常变量及修复所花费的时间精力，也避免了人工排查过程中，可能出现遗漏的场景，大大提高了变量异常检测及修复的效率。因此本发明提出的前端变量异常检测及修复装置，可以解决变量异常检测及修复效率较低的问题。

如图7所示，是本发明一实施例提供的实现前端变量异常检测及修复方法的电子设备的结构示意图。

所述电子设备可以包括处理器10、存储器11、通信接口12和总线13，还可以包括存储在所述存储器11中并可在所述处理器10上运行的计算机程序，如前端变量异常检测及修复程序。

其中，所述存储器11至少包括一种类型的可读存储介质，所述可读存储介质包括闪存、移动硬盘、多媒体卡、卡型存储器(例如：SD或DX存储器等)、磁性存储器、磁盘、光盘等。所述存储器11在一些实施例中可以是电子设备的内部存储单元，例如该电子设备的移动硬盘。所述存储器11在另一些实施例中也可以是电子设备的外部存储设备，例如电子设备上配备的插接式移动硬盘、智能存储卡(Smart Media Card，SMC)、安全数字(SecureDigital，SD)卡、闪存卡(Flash Card)等。进一步地，所述存储器11还可以既包括电子设备的内部存储单元也包括外部存储设备。所述存储器11不仅可以用于存储安装于电子设备的应用软件及各类数据，例如前端变量异常检测及修复程序的代码等，还可以用于暂时地存储已经输出或者将要输出的数据。

所述处理器10在一些实施例中可以由集成电路组成，例如可以由单个封装的集成电路所组成，也可以是由多个相同功能或不同功能封装的集成电路所组成，包括一个或者多个中央处理器(Central Processing Unit，CPU)、微处理器、数字处理芯片、图形处理器及各种控制芯片的组合等。所述处理器10是所述电子设备的控制核心(Control Unit)，利用各种接口和线路连接整个电子设备的各个部件，通过运行或执行存储在所述存储器11内的程序或者模块(例如前端变量异常检测及修复程序等)，以及调用存储在所述存储器11内的数据，以执行电子设备的各种功能和处理数据。

所述通信接口12用于上述电子设备与其他设备之间的通信，包括网络接口和用户接口。可选地，所述网络接口可以包括有线接口和/或无线接口(如WI-FI接口、蓝牙接口等)，通常用于在该电子设备与其他电子设备之间建立通信连接。所述用户接口可以是显示器(Display)、输入单元(比如键盘(Keyboard))，可选地，用户接口还可以是标准的有线接口、无线接口。可选地，在一些实施例中，显示器可以是LED显示器、液晶显示器、触控式液晶显示器以及OLED(Organic Light-Emitting Diode，有机发光二极管)触摸器等。其中，显示器也可以适当的称为显示屏或显示单元，用于显示在电子设备中处理的信息以及用于显示可视化的用户界面。

所述总线13可以是外设部件互连标准(Peripheral Component Interconnect，简称PCI)总线或扩展工业标准结构(Extended Industry Standard Architecture，简称EISA)总线等。该总线13可以分为地址总线、数据总线、控制总线等。所述总线13被设置为实现所述存储器11以及至少一个处理器10等之间的连接通信。

图7仅示出了具有部件的电子设备，本领域技术人员可以理解的是，图7示出的结构并不构成对所述电子设备的限定，可以包括比图示更少或者更多的部件，或者组合某些部件，或者不同的部件布置。

例如，尽管未示出，所述电子设备还可以包括给各个部件供电的电源(比如电池)，优选地，电源可以通过电源管理装置与所述至少一个处理器10逻辑相连，从而通过电源管理装置实现充电管理、放电管理、以及功耗管理等功能。电源还可以包括一个或一个以上的直流或交流电源、再充电装置、电源故障检测电路、电源转换器或者逆变器、电源状态指示器等任意组件。所述电子设备还可以包括多种传感器、蓝牙模块、Wi-Fi模块等，在此不再赘述。

进一步地，所述电子设备还可以包括网络接口，可选地，所述网络接口可以包括有线接口和/或无线接口(如WI-FI接口、蓝牙接口等)，通常用于在该电子设备与其他电子设备之间建立通信连接。

可选地，该电子设备还可以包括用户接口，用户接口可以是显示器(Display)、输入单元(比如键盘(Keyboard))，可选地，用户接口还可以是标准的有线接口、无线接口。可选地，在一些实施例中，显示器可以是LED显示器、液晶显示器、触控式液晶显示器以及OLED(Organic Light-Emitting Diode，有机发光二极管)触摸器等。其中，显示器也可以适当的称为显示屏或显示单元，用于显示在电子设备中处理的信息以及用于显示可视化的用户界面。

应该了解，所述实施例仅为说明之用，在专利申请范围上并不受此结构的限制。

所述电子设备中的所述存储器11存储的前端变量异常检测及修复程序是多个指令的组合，在所述处理器10中运行时，可以实现：

具体地，所述处理器10对上述指令的具体实现方法可参考附图对应实施例中相关步骤的描述，在此不赘述。

进一步地，所述电子设备集成的模块/单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读存储介质中。所述计算机可读存储介质可以是易失性的，也可以是非易失性的。例如，所述计算机可读介质可以包括：能够携带所述计算机程序代码的任何实体或装置、记录介质、U盘、移动硬盘、磁碟、光盘、计算机存储器、只读存储器(ROM，Read-Only Memory)。

本发明还提供一种计算机可读存储介质，所述可读存储介质存储有计算机程序，所述计算机程序在被电子设备的处理器所执行时，可以实现：

在本发明所提供的几个实施例中，应该理解到，所揭露的设备，装置和方法，可以通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如，所述模块的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式。

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

另外，在本发明各个实施例中的各功能模块可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用硬件加软件功能模块的形式实现。

对于本领域技术人员而言，显然本发明不限于上述示范性实施例的细节，而且在不背离本发明的精神或基本特征的情况下，能够以其他的具体形式实现本发明。

因此，无论从哪一点来看，均应将实施例看作是示范性的，而且是非限制性的，本发明的范围由所附权利要求而不是上述说明限定，因此旨在将落在权利要求的等同要件的含义和范围内的所有变化涵括在本发明内。不应将权利要求中的任何附关联图标记视为限制所涉及的权利要求。

本发明实施例可以基于人工智能技术对相关的数据进行获取和处理。其中，人工智能(Artificial Intelligence，AI)是利用数字计算机或者数字计算机控制的机器模拟、延伸和扩展人的智能，感知环境、获取知识并使用知识获得最佳结果的理论、方法、技术及应用系统。

人工智能基础技术一般包括如传感器、专用人工智能芯片、云计算、分布式存储、大数据处理技术、操作/交互系统、机电一体化等技术。人工智能软件技术主要包括计算机视觉技术、机器人技术、生物识别技术、语音处理技术、自然语言处理技术以及机器学习/深度学习等几大方向。

本发明所指区块链是分布式数据存储、点对点传输、共识机制、加密算法等计算机技术的新型应用模式。区块链(Blockchain)，本质上是一个去中心化的数据库，是一串使用密码学方法相关联产生的数据块，每一个数据块中包含了一批次网络交易的信息，用于验证其信息的有效性(防伪)和生成下一个区块。区块链可以包括区块链底层平台、平台产品服务层以及应用服务层等。

此外，显然“包括”一词不排除其他单元或步骤，单数不排除复数。系统权利要求中陈述的多个单元或装置也可以由一个单元或装置通过软件或者硬件来实现。第二等词语用来表示名称，而并不表示任何特定的顺序。

最后应说明的是，以上实施例仅用以说明本发明的技术方案而非限制，尽管参照较佳实施例对本发明进行了详细说明，本领域的普通技术人员应当理解，可以对本发明的技术方案进行修改或等同替换，而不脱离本发明技术方案的精神和范围。

Claims

1.一种前端变量异常检测及修复方法，其特征在于，所述方法包括：

2.如权利要求1所述的前端变量异常检测及修复方法，其特征在于，所述构建前端项目的变量异常检测及修复项目，包括：

3.如权利要求1中所述的前端变量异常检测及修复方法，其特征在于，所述根据所述变量异常检测及修复项目从所述前端项目中查找出待修复组件，包括：

4.如权利要求3所述的前端变量异常检测及修复方法，其特征在于，所述利用预设的多轮关键词检索方法提取所述目标文件集合中的待修复组件，包括：

5.如权利要求1所述的前端变量异常检测及修复方法，其特征在于，所述识别所述待修复组件中的异常变量，包括：

提取所述待修复组件中的变量容器；

确定所述变量容器中被重新设置的变量为所述异常变量。

6.如权利要求1所述的前端变量异常检测及修复方法，其特征在于，所述对变量值类型识别为数组类型的异常变量进行数组转化处理，包括：

识别出数组类型的异常变量的数组调用方法并删除；

在删除后的异常变量中设置预设的数组替换方法。

7.如权利要求1所述的前端变量异常检测及修复方法，其特征在于，所述对变量值类型识别为对象类型的异常变量进行属性扩展处理，包括：

判断对象类型的异常变量是否存在对象直接添加属性操作；

8.一种前端变量异常检测及修复装置，其特征在于，所述装置包括：

9.一种电子设备，其特征在于，所述电子设备包括：

至少一个处理器；以及，

与所述至少一个处理器通信连接的存储器；其中，

所述存储器存储有可被所述至少一个处理器执行的计算机程序，所述计算机程序被所述至少一个处理器执行，以使所述至少一个处理器能够执行如权利要求1至7中任意一项所述的前端变量异常检测及修复方法。

10.一种计算机可读存储介质，存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现如权利要求1至7中任意一项所述的前端变量异常检测及修复方法。