CN116822472B - 一种快速拉取多源数据填充复杂界面表单的方法及系统 - Google Patents

Abstract

本发明属于数据处理技术领域，公开了一种快速拉取多源数据填充复杂界面表单的方法及系统。该方法在浏览器端采用多线程技术并行拉取多数据源；同时对数据源的内容和类型进行优先级排序；从数据源中获得的数据，获取响应数据流并对数据流进行边下载、边解析、边渲染至页面展示。本发明具备支持多数据源、数据清洗、快速填充等特点。本发明提出了一种在线表格数据快速填充的方法。利用worker实现多线程作业，并行处理多数据源数据拉取工作，在前端实现流式JSON数据解析，将解析完成后的数据按照值、组件的优先级进行填充渲染，从而达到在前端下载数据的同时进行数据解析、渲染，有效减少整体渲染时间的目的。

Description

一种快速拉取多源数据填充复杂界面表单的方法及系统

技术领域

本发明属于数据处理技术领域，尤其涉及一种快速拉取多源数据填充复杂界面表单的方法及系统。

背景技术

近年来，工业互联网快速发展，制造业企业开始越来越多的在线上处理业务数据，其中不乏存在一些复杂表格的在线展示，且随着业务系统的增多，同一页面往往需要请求来自不同业务系统的数据进行在线展示，这就给前端的数据加载和页面渲染提出了挑战。因为数据量大、表格展示形式复杂，导致前端数据加载慢、用户等待时间变长、操作卡顿甚至网页频频崩溃，一种快速的在线表格数据的填充方法就变得有必要。

通过上述分析，现有技术存在的问题及缺陷为：在线表单数据在加载过程中，存在表格展示复杂、数据量大、数据来源多且复杂的场景，这个时候就会产生页面卡顿、数据加载慢、页面渲染时间过长的问题，影响用户的操作体验。为应对这种场景，提供了一种快速在WEB端多数据源加载、清洗和填充的解决方法。

发明内容

为克服相关技术中存在的问题，本发明公开实施例提供了一种快速拉取多源数据填充复杂界面表单的方法及系统。

所述技术方案如下：一种快速拉取多源数据填充复杂界面表单的方法，通过多线程并行加载数据、大数据切分小数据块逐步渲染，具体包括以下步骤：

S1，在浏览器端采用多线程技术并行拉取多数据源；

S2，对从数据源中获得的数据进行下载的同时将大数据切分为小数据块，对小数据块进行解析；

S3，将解析后的数据渲染至页面展示。

在步骤S1中，多线程技术采用调用线程池方法实现，具体包括：

步骤1：调用init()方法初始化线程池，开启timer()定时器；

步骤2：调用getTask()方法获取队列任务，判读任务是否存在，如果存在任务则执行步骤3，如果不存在任务则等待任务；

步骤3：调用getFreeWorker()方法获取可用worker，判断是否存在可用worker，不存在则继续获取可用worker，存在则执行步骤4；

步骤4：调用worker执行，标记worker状态为不可用，在任务执行完成后，标记worker状态为可用，执行步骤2。

在步骤S1中，拉取多数据源包括：对数据源的内容和类型进行优先级排序，在任务数量超过线程池线程数量时，对任务的优先级进行定义，对值类型的数据优先、集合数据次之、组件最后。

在步骤S2中，对从数据源中获得的数据进行下载包括：在浏览器端开始接收数据时对流中的数据进行获取；数据解析，对于集合、对象类数据，利用编写的JSON数据解析工具，在读取流数据的同时进行解析。

进一步，利用编写的JSON数据解析工具，在读取流数据的同时进行解析中，进行JSON解析预处理，将数据流中字符以{开始，以}结束的对象部分字符集切割，将数据流中字符以[开始，以]结束的数组部分字符集切割；具体包括：

步骤i：读取数据流中下一个字符，如果字符存在，执行步骤ii，否则结束流程；

步骤ii：判断字符是否等于{，等于{时调用栈push()方法入栈，否则执行步骤iii；

步骤iii：判断字符是否等于[，等于[时调用栈push()方法入栈，否则执行步骤iv；

步骤iv：判断字符是否等于}，等于}时执行步骤v，否则执行步骤vii；

步骤v：调用栈pop()方法出栈，判断出栈字符是否等于“{”，不等于时重复执行步骤v，否则执行步骤vi；

步骤vi：将步骤v所有的出栈字符利用JSON字符串解析方法进行出栈字符；

步骤vii：判断字符是否等于]，等于]时执行步骤viii，否则执行步骤x；

步骤viii：调用栈pop()方法出栈，判断出栈字符是否等于[，不等于时重复执行步骤viii，否则执行步骤ix；

步骤ix：将步骤viii所有的出栈字符利用JSON字符串解析方法进行出栈字符串解析；

步骤x：调用栈push()方法入栈，执行步骤i。

在步骤vi和步骤ix中，JSON字符串解析方法包括：

步骤a：输入字符串；

步骤b：词法分析，按照JSON构词规则将字符串解析成Token序列；

步骤c：语法分析，语法分析过程以词法分析解析出的Token序列作为输入，输出JSON Object或JSON Array。

在步骤b中，词法分析过程将JSON字符串通过词法解析器UML利用JSON构词规则TokenType解析成Token序列。

在步骤c中，语法分析流程包括：

步骤A：读取下一个token，存在则执行步骤B，不存在结束流程；

步骤B：判断是否为字符串token，是字符串token执行步骤C，否则执行步骤A；

步骤C：将当前字符串token值去出，作为对象属性key，执行步骤D；

步骤D：读取下一个token，此时token应为冒号token，继续执行步骤E；

步骤E：读取下一个token，此时token值即为对象属性key对应的值，执行步骤F；

步骤F：将属性及其对应值存入JSON Object，继续执行步骤A；

语法分析流程进一步包括：

步骤I：读取下一个token，存在则执行步骤II，不存在结束流程；

步骤II：将当前token值取出，加入JSON Array，继续执行步骤I。

在步骤S3中，进行渲染包括：将返回数据拆分为多个JSON Object或JSON Array解析后的数据渲染到页面。

本发明的另一目的在于提供一种快速拉取多源数据填充复杂界面表单的系统，实施所述快速拉取多源数据填充复杂界面表单的方法，该系统搭载在浏览器端，包括：

并行拉取多数据源模块，用于采用多线程技术并行拉取多数据源；同时对数据源的内容和类型进行优先级排序；

同步加载解析模块，用于对从数据源中获得的数据进行下载的同时将大数据切分为小数据块，对小数据块进行解析；

渲染模块，用于将解析后的数据渲染至页面展示。

结合上述的所有技术方案，本发明所具备的优点及积极效果为：本发明提供一种在线表格数据快速填充的方法实现，该方法具备支持多数据源、数据清洗、快速填充等特点。本发明提出了一种在线表格数据快速填充的方法。利用专用工作者线程服务端提供的信息进行数据的异步、并行式拉取。数据渲染使用流中的数据，不必等到数据全部下载完成。数据渲染采用值优先，组件次之的方式进行填充。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理；

图1是本发明实施例提供的快速拉取多源数据填充复杂界面表单的方法流程图；

图2是本发明实施例提供的快速拉取多源数据填充复杂界面表单的方法整体原理图；

图3是本发明实施例提供的线程池workerPool类定义图；

图4是本发明实施例提供的线程池执行流程图；

图5是本发明实施例提供的JSON数据解析整体流程图；

图6是本发明实施例提供的stack类图；

图7是本发明实施例提供的json解析预处理流程图；

图8是本发明实施例提供的json解析预处理流程图；

图9是本发明实施例提供的词法解析流程图；

图10是本发明实施例提供的词法解析器UML图；

图11是本发明实施例提供的JSON Object语法分析流程图；

图12是本发明实施例提供的JSON Array语法分析流程图；

图13是本发明实施例提供的数据渲染图。

具体实施方式

为使本发明的上述目的、特征和优点能够更加明显易懂，下面结合附图对本发明的具体实施方式做详细的说明。在下面的描述中阐述了很多具体细节以便于充分理解本发明。但是本发明能够以很多不同于在此描述的其他方式来实施，本领域技术人员可以在不违背本发明内涵的情况下做类似改进，因此本发明不受下面公开的具体实施的限制。

与本发明相关的技术词语包括：数据源：提供数据的载体，本发明中专指由服务端提供的可以通过请求获取到数字、文本、文件、图片等数据的数据服务。

工作者线程：也被称为Worker，是一种前端的实用工具，可以让脚本单独创建一个Java Script线程，以执行委托的任务。在本发明中，工作者线程用于实现并行处理任务。

线程池：一种线程使用模式，把一个或多个线程通过统一的方式进行调度和重复使用的技术。线程过多会带来调度开销，进而影响缓存局部性能和整体性能。而线程池维护着多个线程，等待着监督管理者分配可并发执行的任务。这避免了在处理短时间任务时创建与销毁线程的代价。线程池不仅能够保证内核的充分利用，还能防止过分调度。可用线程数量应该取决于可用的并发处理器、处理器内核、内存、网络sockets等数量。

栈：限定仅在表尾进行插入或删除操作的线性表。向一个栈插入新元素又称作进栈、入栈或压栈，它是把新元素放到栈顶元素的上面，使之成为新的栈顶元素；从一个栈删除元素又称作出栈或退栈，它是把栈顶元素删除掉，使其相邻的元素成为新的栈顶元素。

JSON：JSON（JavaScript Object Notation）是一种轻量级的数据交换格式。易于人阅读和编写，可以在多种语言之间进行数据交换。同时也易于机器解析和生成。它基于JavaScript Programming Language, Standard ECMA-262 3rd Edition-December 1999的一个子集。

本发明实施例本提供的快速拉取多源数据填充复杂界面表单的方法包括：在浏览器端采用多线程技术拉取多源数据，通过多线程的并行能力，并行从多数据源中拉取数据，提高速度。同时对数据源的内容和类型进行排序，按照一定顺序执行拉取线程。为达到快速填充的目的，对对从数据源中获得的数据进行下载的同时将大数据切分为小数据块，对小数据块进行解析后渲染到界面的方式而不是传统的加载完成后再解析的方式，发明一种在前端使用流式JSON解析的方法提高从拉取、解析、渲染的速度。具体的执行：多源数据拉取、多worker 的限制、填充的优先级，实现边下载、边解析、边渲染。

具体的，如图1所示，本发明实施例提供一种快速拉取多源数据填充复杂界面表单的方法，包括以下步骤：

S1，在浏览器端采用多线程技术并行拉取多数据源；

S2，对从数据源中获得的数据进行下载的同时将大数据切分为小数据块，对小数据块进行解析；

S3，将解析后的数据渲染至页面展示。

实施例1，作为本发明另一种实施方式，本发明实施例提供的快速拉取多源数据填充复杂界面表单的方法包括：前端开启多线程任务，按照一定的优先级并行拉取来自多个数据源的数据，在获取到数据源的响应数据后，解析返回的数据流，不必等待全部数据解析完成，在最小可渲染单元的数据解析完成后立即渲染至页面展示。如图2所示。

在本发明实施例中，数据异步、并行式拉取包括：

使用工作者线程。浏览器可以在原始页面环境之外再分配一个完全独立的二级子环境。这个子环境不能与依赖单线程交互的API（如DOM）互操作，但可以与父环境并行执行代码。专用工作者线程是最简单的Web工作者线程，网页中的脚本可以创建专用工作者线程来执行在页面线程之外的其他任务。这样的线程可以与父页面交换信息、发送网络请求、执行文件输入/输出、进行密集计算、处理大量数据，以及实现其他不适合在页面执行线程里做的任务。

工作者线程之间通信。在工作者线程并行拉取服务端数据的时候，进程间数据通信采用异步消息的方式实现。异步消息可采用postMessage、MessageChannel或BroadcastChannel方式实现，其中最常用的方式是使用postMessage传递序列化的消息，如将worker的数据发送至主线程可以这样实现：const {parentPort}=require('worker_threads');parentPort.postMessage(data);

线程池。启用工作者线程的代价很大，启用过多的工作者线程反而会降低数据拉取的效率，可以保持固定数量(系统的核心数)的线程活动，需要时将任务分派给它们。工作者线程在执行的时候标记不可用状态，直到执行完成后通知线程池可用了，准备接收新任务；一个简单的线程池实现方案如下：

线程池workerPool类定义如图3所示。

taskQuene：任务队列，用于暂存任务。

workerArray：worker数组，用于储存线程池内worker。

workerStatusArray：worker可用状态索引，用于记录worker的实时状态。

init()：线程池初始化方法。获取当前系统核心数量n，创建n个worker，加入到worker数组中；worker可用状态索引全部为可用；开启timer()定时器。

getTask()：判断任务队列是否未空，不为空时，取出任务队列中第一个任务，否则返回空。

getFreeWorker()：判断workerStatusArray中是否存在可用索引，不存在时返回空，存在时返回索引对应workerArray中的可用worker。

execute()：先执行getFreeWorker()方法，如果未获取到可用worker，结束execute()方法。如果获取到可用worker，执行getTask()方法获取任务，如果任务不存在，结束execute()方法，如果任务存在，使用worker执行任务，更新worker状态索引为不可用，任务执行完成后，更新worker状态索引为可用，结束execute()方法。

timer()：定时器，循环调用execute()方法。

线程池执行流程如图4所示，包括：

步骤1：调用init()方法初始化线程池，开启timer()定时器。

步骤2：调用getTask()方法获取队列任务，判读任务是否存在，如果存在任务则执行步骤3，如果不存在任务则等待任务。

步骤3：调用getFreeWorker()方法获取可用worker，判断是否存在可用worker，不存在则继续获取可用worker，存在则执行步骤4。

步骤4：调用worker执行，标记worker状态为不可用，在任务执行完成后，标记worker状态为可用，执行步骤2。

根据系统的核心数作为线程池的数量，执行步骤1初始化线程池，将任务加入任务队列，执行步骤2。

4）优先级定义。在任务数量超过线程池线程数量的时候，需要对任务的优先级进行定义。针对本发明应对场景而言，值类型的数据优先、集合数据次之、组件最后。

在本发明实施例中，数据流获取：Fetch API可在工作线程中使用，fetch()方法请求服务端数据，在获得响应时产生一个Response对象，可以通过这个Response对象获取相应资源。通常情况是通过Response的text()方法取得文本格式的内容，但在返回数据巨大的时候，就需要等待数据完全下载完成并完成解码后才能使用，这就增加了用户的等待时间，为缩短用户等待时间，本发明采用在客户端开始接收数据的时候就对流中的数据进行获取计算。

在本发明实施例中，数据解析：对于集合、对象类数据，因为对流中的数据进行获取计算，需要编写一个JSON数据解析工具，在读取流数据的同时进行解析，解析整体流程如图5 JSON数据解析整体流程所示。

栈stack类定义如图6所示。

stackChar：栈字符集，用于存储栈内字符集。

push(char c)：入栈方法，将传入字符c加入stackChar[]。

pop()：出栈方法，将stackChar[]最后一个字符返回，并将其移出数组。

在本发明实施例中，JSON解析预处理流程，将数据流中字符以“{”开始，以“}”结束的对象部分字符集切割，将数据流中字符以“[”开始，以“]”结束的数组部分字符集切割。如图7，JSON解析预处理流程图所示。具体包括：

步骤i：读取数据流中下一个字符，如果字符存在，执行步骤ii，否则结束流程。

步骤ii：判断字符是否等于“{”，等于“{”时调用栈push()方法入栈，否则执行步骤iii。

步骤iii：判断字符是否等于“[”，等于“[”时调用栈push()方法入栈，否则执行步骤iv。

步骤iv：判断字符是否等于“}”，等于“}”时执行步骤v，否则执行步骤vii。

步骤v：调用栈pop()方法出栈，判断出栈字符是否等于“{”，不等于时重复执行步骤v，否则执行步骤vi。

步骤vi：将步骤v所有的出栈字符进行出栈字符串解析（具体执行方法参见JSON字符串解析流程）。

步骤vii：判断字符是否等于“]”，等于“]”时执行步骤viii，否则执行步骤x。

步骤viii：调用栈pop()方法出栈，判断出栈字符是否等于“[”，不等于时重复执行步骤viii，否则执行步骤ix。

步骤ix：将步骤viii所有的出栈字符进行出栈字符串解析（具体执行方法参见JSON字符串解析流程）。

步骤x：调用栈push()方法入栈，执行步骤i。

在本发明实施例中，JSON字符串解析流程：JSON解析就是根据JSON文法规则创建的状态机，输入是一个JSON字符串，输出是一个JSON对象。本发明的解析过程包括词法分析和语法分析，词法分析过程将JSON字符串解析成Token序列，语法分析过程检查Token序列所构成的JSON格式是否合法并输出JSON对象，如图8，JSON字符串解析流程图所示。具体包括：

步骤a：输入字符串。

步骤b：词法分析，即按照JSON构词规则将字符串解析成Token序列，详细参见图9词法解析流程。

步骤c：语法分析，语法分析过程以词法分析解析出的Token序列作为输入，输出JSON Object或JSON Array，如图9词法解析流程所示。

在本发明实施例中，词法解析器UML图如图10所示包括：

JSON构词规则TokenType：对象开始（{）、对象结束（}）、数组开始（）、数组结束（）、空（null）、数字、字符串、布尔值（true/false）、冒号（:）、逗号（,）。

读取字符串类CharReader：

peek()查看当前位置字符。

next()读取下一个字符。

back()位置回退。

hasMore()是否还有字符。

词法解析类Tokenizer:

charReader：读取字符串类。

token[]：token序列。

readNull()：读取一个null token。

readStr()：读取一个字符串 token。

readNumber()：读取一个数字token。

readBoolean()：读取一个布尔值 token。

start()：读取一个字符，如果字符是“{”，“}”，“[”，“]”，“,”，“:”，直接封装为对应的token返回；如果字符是n，调用readNull()方法，返回null token；如果字符是t或f，调用readBoolean()方法，返回布尔值token;如果字符是双引号，调用readStr()方法，返回字符串token，如果字符是0~9，调用readNumber()方法，返回数值tokne。

tokenize()：循环执行start，直到读取字符结束。

在本发明实施例中，语法分析实现文法如下：

object = {}|{ members }

members = pair | pair, members

pair = string : value

array = [] | [elements]

elements = value | value, elements

value = string | number | object | array | true | false | null。

在本发明实施例中，由于经过JSON预处理，切割后的字符串分为两种，第一种为JSON Object对应的字符串，且其内部元素不再包含Object和Array，处理流程如图11 JSONObject语法分析流程图。具体包括：

步骤A：读取下一个token，存在则执行步骤B，不存在结束流程。

步骤B：判断是否为字符串token，是字符串token执行步骤C，否则执行步骤A。

步骤C：将当前字符串token值去出，作为对象属性key，执行步骤D。

步骤D：读取下一个token，此时token应为冒号token，继续执行步骤E。

步骤E：读取下一个token，此时token值即为对象属性key对应的值，执行步骤F。

步骤F：将属性及其对应值存入JSON Object，继续执行步骤A。

在本发明实施例中，第二种为JSON Array对应的字符串，且其内部元素不再包含Object和Array，处理流程如图12 JSON Array语法分析流程图。具体包括：

步骤I：读取下一个token，存在则执行步骤II，不存在结束流程。

步骤II：将当前token值取出，加入JSON Array，继续执行步骤I。

在本发明实施例中，数据渲染：在JSON Object或JSON Array解析出后就可以将数据渲染到页面了，由于将返回数据拆分为多个Object或Array，在任意一个Object或Array解析完成后，即可将其渲染至页面，整体流程如图13，数据渲染所示。

其中，由于将返回结果拆分为多个对象或数组，在页面渲染时候需要对其进行位置确认，如表格数据渲染的行或列，此项功能应根据具体返回对象进行单独设计。

在上述实施例中，对各个实施例的描述都各有侧重，某个实施例中没有详述或记载的部分，可以参见其它实施例的相关描述。

上述装置/单元之间的信息交互、执行过程等内容，由于与本发明方法实施例基于同一构思，其具体功能及带来的技术效果，具体可参见方法实施例部分，此处不再赘述。

所属领域的技术人员可以清楚地了解到，为了描述的方便和简洁，仅以上述各功能单元、模块的划分进行举例说明，实际应用中，可以根据需要而将上述功能分配由不同的功能单元、模块完成，即将所述装置的内部结构划分成不同的功能单元或模块，以完成以上描述的全部或者部分功能。实施例中的各功能单元、模块可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中，上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。另外，各功能单元、模块的具体名称也只是为了便于相互区分，并不用于限制本发明的保护范围。上述系统中单元、模块的具体工作过程，可以参考前述方法实施例中的对应过程。

基于上述本发明实施例记载的技术方案，进一步的可提出以下应用例。

根据本申请的实施例，本发明还提供了一种计算机设备，该计算机设备包括：至少一个处理器、存储器以及存储在所述存储器中并可在所述至少一个处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现上述任意各个方法实施例中的步骤。

本发明实施例还提供了一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，所述计算机程序被处理器执行时可实现上述各个方法实施例中的步骤。

本发明实施例还提供了一种信息数据处理终端，所述信息数据处理终端用于实现于电子装置上执行时，提供用户输入接口以实施如上述各方法实施例中的步骤，所述信息数据处理终端不限于手机、电脑、交换机。

本发明实施例还提供了一种服务器，所述服务器用于实现于电子装置上执行时，提供用户输入接口以实施如上述各方法实施例中的步骤。

本发明实施例还提供了一种计算机程序产品，当计算机程序产品在电子设备上运行时，使得电子设备执行时可实现上述各个方法实施例中的步骤。

所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本申请实现上述实施例方法中的全部或部分流程，可以通过计算机程序来指令相关的硬件来完成，所述的计算机程序可存储于一计算机可读存储介质中，该计算机程序在被处理器执行时，可实现上述各个方法实施例的步骤。其中，所述计算机程序包括计算机程序代码，所述计算机程序代码可以为源代码形式、对象代码形式、可执行文件或某些中间形式等。所述计算机可读介质至少可以包括：能够将计算机程序代码携带到拍照装置/终端设备的任何实体或装置、记录介质、计算机存储器、只读存储器（Read-Only Memory，ROM）、随机存取存储器（Random AccessMemory，RAM）、电载波信号、电信信号以及软件分发介质。例如U盘、移动硬盘、磁碟或者光盘等。

为进一步证明上述实施例的积极效果，本发明基于上述技术方案进行如下实验：针对数据量大、数据源多产生的数据加载慢、页面渲染卡顿、渲染时间长的问题，本发明提出了多线程异步处理、大数据切分小数据块逐步渲染的解决方法，消除了页面渲染卡顿的问题，在页面渲染的过程中用户可以看到数据一步一步加载出来的效果，提供了一种快速拉取多源数据填充复杂界面表单的方法。

以上所述，仅为本发明较优的具体的实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，凡在本发明的精神和原则之内所作的任何修改、等同替换和改进等，都应涵盖在本发明的保护范围之内。

Claims (5)

1.一种快速拉取多源数据填充复杂界面表单的方法，其特征在于，该方法通过多线程并行加载数据、大数据切分小数据块逐步渲染，具体包括以下步骤：

S1，在浏览器端采用多线程技术并行拉取多数据源；

S2，对从数据源中获得的数据进行下载的同时将大数据切分为小数据块，对小数据块进行解析；

S3，将解析后的数据渲染至页面展示；

在步骤S2中，对从数据源中获得的数据进行下载包括：在浏览器端开始接收数据时对流中的数据进行获取；数据解析，对于集合、对象类数据，利用编写的JSON数据解析工具，在读取流数据的同时进行解析；

利用编写的JSON数据解析工具，在读取流数据的同时进行解析中，进行JSON解析预处理，将数据流中字符以{开始，以}结束的对象部分字符集切割，将数据流中字符以[开始，以]结束的数组部分字符集切割；具体包括：

步骤i：读取数据流中下一个字符，如果字符存在，执行步骤ii，否则结束流程；

步骤ii：判断字符是否等于{，等于{时调用栈push()方法入栈，否则执行步骤iii；

步骤iii：判断字符是否等于[，等于[时调用栈push()方法入栈，否则执行步骤iv；

步骤iv：判断字符是否等于}，等于}时执行步骤v，否则执行步骤vii；

步骤v：调用栈pop()方法出栈，判断出栈字符是否等于“{”，不等于时重复执行步骤v，否则执行步骤vi；

步骤vi：将步骤v所有的出栈字符利用JSON字符串解析方法进行出栈字符；

步骤vii：判断字符是否等于]，等于]时执行步骤viii，否则执行步骤x；

步骤viii：调用栈pop()方法出栈，判断出栈字符是否等于[，不等于时重复执行步骤viii，否则执行步骤ix；

步骤ix：将步骤viii所有的出栈字符利用JSON字符串解析方法进行出栈字符串解析；

步骤x：调用栈push()方法入栈，执行步骤i；

在步骤vi和步骤ix中，JSON字符串解析方法包括：

步骤a：输入字符串；

步骤b：词法分析，按照JSON构词规则将字符串解析成Token序列；

步骤c：语法分析，语法分析过程以词法分析解析出的Token序列作为输入，输出JSONObject或JSON Array；

在步骤c中，语法分析流程包括：

步骤A：读取下一个token，存在则执行步骤B，不存在结束流程；

步骤B：判断是否为字符串token，是字符串token执行步骤C，否则执行步骤A；

步骤C：将当前字符串token值去出，作为对象属性key，执行步骤D；

步骤D：读取下一个token，此时token应为冒号token，继续执行步骤E；

步骤E：读取下一个token，此时token值即为对象属性key对应的值，执行步骤F；

步骤F：将属性及其对应值存入JSON Object，继续执行步骤A；

语法分析流程进一步包括：

步骤I：读取下一个token，存在则执行步骤II，不存在结束流程；

步骤II：将当前token值取出，加入JSON Array，继续执行步骤I；

在步骤S3中，进行渲染包括：将返回数据拆分为多个JSON Object或JSON Array解析后的数据渲染到页面。

2.根据权利要求1所述的快速拉取多源数据填充复杂界面表单的方法，其特征在于，在步骤S1中，多线程技术采用调用线程池方法实现，具体包括：

步骤1：调用init()方法初始化线程池，开启timer()定时器；

步骤2：调用getTask()方法获取队列任务，判读任务是否存在，如果存在任务则执行步骤3，如果不存在任务则等待任务；

步骤3：调用getFreeWorker()方法获取可用worker，判断是否存在可用worker，不存在则继续获取可用worker，存在则执行步骤4；

步骤4：调用worker执行，标记worker状态为不可用，在任务执行完成后，标记worker状态为可用，执行步骤2。

3.根据权利要求1所述的快速拉取多源数据填充复杂界面表单的方法，其特征在于，在步骤S1中，拉取多数据源包括：对数据源的内容和类型进行优先级排序，在任务数量超过线程池线程数量时，对任务的优先级进行定义，对值类型的数据优先、集合数据次之、组件最后。

4.根据权利要求1所述的快速拉取多源数据填充复杂界面表单的方法，其特征在于，在步骤b中，词法分析过程将JSON字符串通过词法解析器UML利用JSON构词规则TokenType解析成Token序列。

5.一种快速拉取多源数据填充复杂界面表单的系统，其特征在于，实施权利要求1-4任意一项所述快速拉取多源数据填充复杂界面表单的方法，该系统搭载在浏览器端，包括：

并行拉取多数据源模块，用于采用多线程技术并行拉取多数据源；同时对数据源的内容和类型进行优先级排序；

同步加载解析模块，用于对从数据源中获得的数据进行下载的同时将大数据切分为小数据块，对小数据块进行解析；

渲染模块，用于将解析后的数据渲染至页面展示。