表1 頁面動(dòng)作流圖符

名稱 圖符

開始節(jié)點(diǎn)

頁面節(jié)點(diǎn)

動(dòng)作節(jié)點(diǎn)

有向連線

2.4 模型

最終用戶在編程時(shí)，可能存在理解障礙和使用障礙，因此在VUDSL設(shè)計(jì)了模型，通過對模型中數(shù)據(jù)實(shí)體的定義，來引導(dǎo)最終用戶完成概念模型到數(shù)據(jù)模型的轉(zhuǎn)換。

VUDSL模型的每個(gè)屬性擁有一種數(shù)值類型，每個(gè)實(shí)體由多個(gè)屬性構(gòu)成。數(shù)據(jù)實(shí)體本身也是一種屬性類型，這樣數(shù)據(jù)實(shí)體間就存在了關(guān)聯(lián)關(guān)系。模型的可視化圖符如表2所示：

表2 模型圖符

名稱 圖符

實(shí)體名稱

屬性

2.5 邏輯

VUDSL的邏輯動(dòng)作節(jié)點(diǎn)Bai由多個(gè)有組織的程序語句塊組成，這些語句塊可以是順序拼接也可以是內(nèi)部嵌入。用戶將相應(yīng)的語句塊拖拽拼接起來即可完成業(yè)務(wù)邏輯的定義。VUDSL的語句塊可以分為三類：值語句塊（ValueBlock）、可嵌套語句塊（NestableBlock）和可測試語句塊（TestableBlock）。

值語句塊用于定義變量或獲取變量，代表了一個(gè)有值返回的一個(gè)操作。VUDSL中定義的值語句塊有獲取全局變量語句塊（GetBlobal-Block）、字符串語句塊（StringBlock），如圖2所示，其中varName為變量名稱，類型為字符串，語句塊返回的是該全局變量的值。字符串語句塊中value為字符串語句塊的值，類型為字符串。

圖2 值語句塊的成員

圖3 可嵌套語句塊的成員

可嵌套語句塊用于表示業(yè)務(wù)邏輯的程序結(jié)構(gòu)，包括順序結(jié)構(gòu)、分支結(jié)構(gòu)、循環(huán)結(jié)構(gòu)等。一個(gè)邏輯動(dòng)作節(jié)點(diǎn)有一個(gè)作為入口的根語句塊，該語句塊即為一個(gè)可嵌套語句塊，表示業(yè)務(wù)邏輯從這個(gè)語句塊開始。VUDSL中定義的可嵌套語句塊有：條件語句塊（IfBlock）、循環(huán)語句塊（WhileBlock）、跳轉(zhuǎn)語句塊（OutputBlock）、設(shè)置全局變量語句塊（SetGlobalBlock）、更新變量語句塊（UpdateBlock）等，如圖3所示。

其中條件語句塊由三個(gè)嵌套進(jìn)去的語句塊組成，condition為一個(gè)可測試語句塊，如果該語句塊的測試條件成立則邏輯進(jìn)入有一些順序組成的可嵌套邏輯塊集合content集合中?？汕短渍Z句塊的順序組合的集合也是一個(gè)可嵌套語句塊。循環(huán)語句塊中condition為可測試語句塊，如果測試條件成立則循環(huán)執(zhí)行content集合中的可嵌套語句塊。跳轉(zhuǎn)語句塊中的name表示一個(gè)跳轉(zhuǎn)名稱。設(shè)置全局變量語句塊設(shè)置變量名為varName的全局變量，變量的值為value值語句塊的返回值。更新變量語句塊更新變量名為varName的值為value值語句塊的返回值。

可測試語句塊表示條件分支和循環(huán)分支的測試條件，典型的可測試語句塊包括相等語句塊（EqualsBlock）、大于（GreaterThanBlock）、小于（LessThanBlock）、并且（AndBlock）和或者（OrBlock）等語句塊，其定義都是一個(gè)二元的可測試語句塊：相等語句塊中，當(dāng)左右值相等時(shí)語句塊返回真，大于、小于與此類似。并且語句塊中當(dāng)左右可測試語句塊的返回都為真的時(shí)候返回真，否則返回假，或者語句塊與此類似。如圖4所示。

圖4 可測試語句塊的成員

邏輯部分的可視化圖符，如表3所示。

表3 邏輯圖符

名稱 圖符

如果—?jiǎng)t

循環(huán)

等于

大于

小于

或者

并且

保存

變量

查找

跳轉(zhuǎn)

2.6 頁面

VUDSL的頁面節(jié)點(diǎn)Bpi有三類元素組成：控件、頁面綁定的實(shí)體、綁定關(guān)系，可以表示為Bpi=，其中，Pc為頁面控件的集合，一個(gè)頁面的內(nèi)容主要通過頁面控件來定義;Pe是和一個(gè)頁面節(jié)點(diǎn)綁定的數(shù)據(jù)實(shí)體集合，表明該頁面節(jié)點(diǎn)要輸入或輸出的數(shù)據(jù)。綁定關(guān)系集合Pb中每個(gè)綁定Pbi指明哪個(gè)實(shí)體和哪個(gè)頁面控件綁定，比如一個(gè)簡單的登錄界面包含登錄表單控件、數(shù)據(jù)實(shí)體用戶和二者間的綁定。

頁面節(jié)點(diǎn)和邏輯動(dòng)作節(jié)點(diǎn)一般（除了只用于顯示的頁面和只更新數(shù)據(jù)的動(dòng)作）都有數(shù)據(jù)實(shí)體輸出。頁面節(jié)點(diǎn)的輸出由頁面中的按鈕元素和鏈接元素定義，這二者都會(huì)定義一個(gè)輸出的標(biāo)志字符串;在邏輯動(dòng)作節(jié)點(diǎn)中，這樣的標(biāo)志字符串有跳轉(zhuǎn)語句塊定義。頁面節(jié)點(diǎn)和邏輯動(dòng)作節(jié)點(diǎn)的輸出實(shí)體都為該節(jié)點(diǎn)使用或定義的數(shù)據(jù)實(shí)體。在VUDSL中，參數(shù)傳遞通過Web應(yīng)用的session來實(shí)現(xiàn)，每個(gè)節(jié)點(diǎn)的數(shù)據(jù)實(shí)體都會(huì)被存入session中。

頁面的可視化圖符如表4所示。

表4頁面圖符

名稱 圖符

表單

數(shù)據(jù)表

3.VUDSL編程工具的實(shí)現(xiàn)

在采用2個(gè)中職院校Web信息系統(tǒng)（選課系統(tǒng)和導(dǎo)師申請招生系統(tǒng)）對VUDSL語言進(jìn)行案例手工驗(yàn)證后，我們設(shè)計(jì)和實(shí)現(xiàn)了VUDSL編程工具，以更好地支持VUDSL編程，生成可執(zhí)行的代碼。

3.1 總體架構(gòu)

VUDSL編程工具的架構(gòu)如圖5所示，它由VUDSL可視化編輯器和UDSL到J2EE的代碼轉(zhuǎn)換器組成。最終用戶使用VUDSL可視化編輯器進(jìn)行應(yīng)用的定義，編輯器可以將信息系統(tǒng)的VUDSL代碼表示序列化為一種中間DSL代碼——UDSL。UDSL代碼作為UDSL到J2EE代碼轉(zhuǎn)換器的輸入，最終被轉(zhuǎn)換成可編譯部署的J2EE代碼。UDSL代碼刪除了VUDSL代碼的可視化特性，使得目標(biāo)代碼的轉(zhuǎn)換更直接和方便。雖然，工具目前僅實(shí)現(xiàn)了Java代碼的生成，但VUDSL本身和目標(biāo)代碼是無關(guān)的，完全可以生成其他語言的代碼。

圖5 VUDSL編程工具的架構(gòu)

3.2 VUDSL編程工具的設(shè)計(jì)與實(shí)現(xiàn)

VUDSL可視化編程器分為三個(gè)模塊：定義模塊、錯(cuò)誤檢測模塊和UDSL轉(zhuǎn)換器模塊，如圖6所示。定義模塊主要用于定義頁面動(dòng)作流、頁面、模型和邏輯，錯(cuò)誤檢測模塊主要是對最終用戶在定義模塊中定義的內(nèi)容進(jìn)行實(shí)時(shí)檢測，如果存在錯(cuò)誤會(huì)及時(shí)提醒用戶。用戶完成VUDSL模型的定義后，UDSL轉(zhuǎn)換器會(huì)根據(jù)用戶的操作及時(shí)地生成相應(yīng)的UDSL，用戶可以導(dǎo)出生成的UDSL。

VUDSL可視化編輯器采用Java來實(shí)現(xiàn)，其中VUDSL的可視化通過使用Swing工具包實(shí)現(xiàn)。VUDSL每個(gè)部分在定義器中都有對應(yīng)的表示，錯(cuò)誤檢測模塊通過監(jiān)測用戶的輸入，對用戶定義的內(nèi)容進(jìn)行檢測，UDSL轉(zhuǎn)換器根據(jù)UDSL的語法以及該語法和VDUSL的對應(yīng)關(guān)系，將信息系統(tǒng)的VUDSL表示轉(zhuǎn)化為UDSL代碼。

圖6 VUDSL可視化編輯器的結(jié)構(gòu)

3.3 UDSL到Java的代碼轉(zhuǎn)換器的設(shè)計(jì)與實(shí)現(xiàn)

程序轉(zhuǎn)換技術(shù)目前比較成熟的有基于轉(zhuǎn)換器的代碼生成、模板化生成器和基于重寫規(guī)則的程序轉(zhuǎn)換。經(jīng)過分析UDSL語言的特點(diǎn)，本文選取了基于重寫規(guī)則的轉(zhuǎn)換技術(shù)，研究和開發(fā)從UDSL代碼到J2EE代碼的轉(zhuǎn)換工具。本文采用了基于Eclipse插件的體系結(jié)構(gòu)來實(shí)現(xiàn)該轉(zhuǎn)換工具，選取Stratego/XT框架作為程序轉(zhuǎn)換的核心框架，并選擇了開源項(xiàng)目Spoofax作為平臺(tái)。

基于重寫規(guī)則的程序轉(zhuǎn)換流程如圖7所示，第一步，在管道的源端，讀入輸入的程序文本，并將其轉(zhuǎn)換為解析樹或抽象語法樹;第二步，將語法樹作修改變換，達(dá)到目標(biāo)語言的抽象語法樹;最后，將輸出樹再轉(zhuǎn)換為程序文本。

圖7 程序轉(zhuǎn)換的流程

4.應(yīng)用實(shí)踐

本文所設(shè)計(jì)的VUDSL語言及工具在浙江交通技師學(xué)院進(jìn)行了試用。為了驗(yàn)證語言及工具的有效性，本文采用了A組和B組對比實(shí)驗(yàn)的方法，兩組分別獨(dú)立開發(fā)招生系統(tǒng)。A組由浙江交通技師學(xué)院的3個(gè)老師來開發(fā)，經(jīng)過一個(gè)星期的培訓(xùn)學(xué)習(xí)，他們使用了4天時(shí)間開發(fā)了系統(tǒng)。圖8和圖9分別是由A組使用VUSDL定義的導(dǎo)師申請招生的頁面動(dòng)作流和申請招生邏輯。B組由一年J2EE開發(fā)經(jīng)驗(yàn)的大二的學(xué)生來進(jìn)行開發(fā)。

圖8 導(dǎo)師申請招生頁面動(dòng)作流

圖9 導(dǎo)師申請招生邏輯

由于使用了最終用戶編程的思想，開發(fā)工作量有了明顯的變化，A組和B組的開發(fā)情況對比如表5所示。

表5 開發(fā)情況對比

A組最終用戶開發(fā)（VUDSL） B組程序員開發(fā)（J2EE）

培訓(xùn)時(shí)間 7天 0天

開發(fā)時(shí)間 4天 10天

開發(fā)工作量 8人天 28人天

上述應(yīng)用實(shí)踐表明：

（1）VUDSL能支持最終用戶的應(yīng)用開發(fā)，開發(fā)更簡單。VUDSL針對特定領(lǐng)域，領(lǐng)域的共性部分語言有預(yù)定義的模型、頁面、邏輯，最終用戶在開發(fā)時(shí)只需對目標(biāo)信息系統(tǒng)的個(gè)性業(yè)務(wù)流程的部分進(jìn)行定制。

（2）VUDSL開發(fā)更快，最終用戶直接編程的總工作量和程序員開發(fā)相比，工作量大大降低。主要表現(xiàn)在：由于程序員和最終用戶間可能存在對業(yè)務(wù)需求理解不一致的問題，最終用戶對需求的理解更準(zhǔn)確到位;兩組使用的編程語言的不同，A組使用的VUDSL特定領(lǐng)域相關(guān)語言比B組使用的通用編程語言有更高的抽象層次。

（3）VUDSL的表達(dá)能力較強(qiáng)，能支持中職院校Web信息系統(tǒng)的常規(guī)功能的開發(fā)。本文實(shí)驗(yàn)時(shí)選取的應(yīng)用案例有一定的代表性，覆蓋了中職院校Web信息系統(tǒng)中常用的功能，包含很多較為復(fù)雜的業(yè)務(wù)流程。

5.相關(guān)工作

最終用戶編程已經(jīng)存在很多具有代表性的DSL語言及相應(yīng)的開發(fā)環(huán)境。文獻(xiàn)[3]綜述了最終用戶編程的不同的方法，包括演示編程、腳本編程、電子表格編程、及時(shí)編程等。文獻(xiàn)[4]綜述了最終用戶編程時(shí)面臨的挑戰(zhàn)以及設(shè)計(jì)一個(gè)最終用戶編程工具時(shí)需要注意的一些關(guān)鍵問題。目前最終用戶編程主要是針對兒童游戲、手機(jī)、電子表格等領(lǐng)域。在兒童編程領(lǐng)域，MIT多媒體實(shí)驗(yàn)室做了大量的研究工作。Logo是Papert和他的同事提出的一種面向兒童的圖形化的編程語言[5]。LogoBlocks是對Logo語言的一種擴(kuò)展，兒童可以通過操作不同大小和形狀的彩色編程塊來編程[6]。和Logo語言相比，該語言使得編程對于兒童來說更為簡單和有趣。Scratch是一個(gè)優(yōu)秀的兒童編程語言，它是由MIT多媒體實(shí)驗(yàn)室的研究組成員共同開發(fā)完成的一套新的程序語言，Scratch語言是專門為八歲以上兒童設(shè)計(jì)，通過Scratch語言兒童可以通過可視化的方式創(chuàng)造性地設(shè)計(jì)出屬于自己的程序[7]。為了滿足兒童的編程需要，文獻(xiàn)[8]為兒童設(shè)計(jì)一款圖形化的編程工具，設(shè)計(jì)了事件、動(dòng)作、狀態(tài)等不同的編程塊。文獻(xiàn)[9]結(jié)合兒童用戶的使用體驗(yàn)及文獻(xiàn)[8]的編程塊的思想，為兒童設(shè)計(jì)了一款筆交互方式編程的工具。

以上的研究主要是針對兒童領(lǐng)域的，在電子表格領(lǐng)域，為了滿足最終用戶進(jìn)行復(fù)雜電子表格設(shè)計(jì)的需要，文獻(xiàn)[10]設(shè)計(jì)了一款面向終端用戶的筆式表單應(yīng)用開發(fā)工具，該工具提供了統(tǒng)一的筆式表單界面和典型應(yīng)用開發(fā)模板，可以幫助用戶快速開發(fā)滿足需求的表單應(yīng)用。

在手機(jī)領(lǐng)域，谷歌的Google有一款支持最終用戶定制手機(jī)應(yīng)用的工具軟件App Inventor。App inventor是一個(gè)可視化的“編程塊”語言，支持最終用戶通過拼接模板的方式來創(chuàng)建手機(jī)應(yīng)用[11]。

目前，針對中職院校Web信息系統(tǒng)領(lǐng)域的DSL的研究不是很多，已經(jīng)比較成熟的研究比如WebDSL，WebDSL定義了豐富的數(shù)據(jù)模型，它是一個(gè)用來構(gòu)建Web應(yīng)用的DSL語言[12]。該語言不是面向最終用戶的，它不支持可視化，語言本身的語法復(fù)雜。相對于通用編程語言而比，該語言的抽象層次也不高，另外由于該語言的領(lǐng)域特性不夠，不能很好地滿足最終用戶編程的需求。本文的主要貢獻(xiàn)是針對最終用戶領(lǐng)域，提出了一種可視化的編程方案，允許最終用戶通過拖拉“積木”的可視化的方式，快速地搭建出滿足實(shí)際應(yīng)用需求的Web信息系統(tǒng)。

6.總結(jié)和展望

本文以中職院校Web信息系統(tǒng)為研究領(lǐng)域，研究最終用戶編程技術(shù)，設(shè)計(jì)了一個(gè)面向最終用戶的可視化的中職院校Web信息領(lǐng)域特定語言VUDSL，并開發(fā)了相應(yīng)的編程工具。文中詳細(xì)描述了VUDSL語言的設(shè)計(jì)及其可視化編程工具的開發(fā)。最后通過對浙江交通技師學(xué)院的老師進(jìn)行培訓(xùn)，選取了典型的應(yīng)用實(shí)例，并通過A組和B組對比實(shí)驗(yàn)，對本文的可視化最終用戶編程方案進(jìn)行檢驗(yàn)。通過實(shí)驗(yàn)論證了該可視化編程語言有足夠的表達(dá)力，使用本文的可視化編輯工具可以幫助最終用戶高效的開發(fā)Web應(yīng)用。今后還將對該工具的易用性、穩(wěn)定性、完整性等方面進(jìn)行進(jìn)一步的完善和改進(jìn)。

參考文獻(xiàn)

[1]H.Lieberman，F(xiàn).Paternó，M.Klann，V.Wulf.End-User Development：an Emerging Paradigm[M].End User Development，Springer，2006.

[2]Ko A J，Myers B A，Aung H H.Six Learning Barriers in End-

User Programming Systems[C].2004 IEEE Symposium on Visual Languages and Human Centric Computing，2004：199-206.

[3]Dao A T N，B?g P H.End-user Programming[D].Aalborg University，2010.

[4]Andrew J.Ko，Robin Abraham，et al.The state of the art in end-user software engineering[J].ACM Computing Surveys.2011，43 （3）：Article No.21.

[5]Kelleher C，Pausch R.Lowering the barriers to programming：a taxonomy of programming environments and languages for novice programmers[J].ACM Computer Survey，2005，37（2）：83-137.

[6]Ramos，J.J.G.;Silva，F(xiàn).A.;V.Oliveira;Alves，L.T.;DAbreu，J.V.V.Development of open hardware and software components for low cost pedagogical robotics programs.In：Anais do IX Simpósio Brasileiro de Automa??o Inteligente（SBAI 2009），Brasília，DF.In Portuguese.

[7]Maloney J，Resnick M，Rusk N，et al.The scratch programming language and environment[J].ACM Transactions on Computing Education（TOCE），2010，10（4）：16.

[8]Xiajian C，Danli W，Hongan W.Design and implementation of a graphical programming tool for children[C].2011 IEEE International Conference on Computer Science and Automation Engineering（CSAE）.IEEE，2011，4：572-576.

[9]王婷婷，王丹力，路璐，等.面向兒童的圖形化編程語言和工具[J].計(jì)算機(jī)輔助設(shè)計(jì)與圖形學(xué)學(xué)報(bào)，2013，25（4）：584-591.

[10]樊銀亭，滕東興，馬翠霞，等.EUDTPFA：一個(gè)面向終端用戶的筆式表單應(yīng)用開發(fā)工具[J].計(jì)算機(jī)輔助設(shè)計(jì)與圖形學(xué)學(xué)報(bào)，2011，23（10）：1629-1640.

[11]Wolber D.App inventor and real-world motivation[C].Proceedings of the 42nd ACM technical symposium on Computer science education.ACM，2011：601-606.

[12]Hemel Z，Groenewegen D M，Kats L C L，et al.Static consistency checking of web applications with WebDSL[J].Journal of Symbolic Computation，2011，46（2）：150-182.

項(xiàng)目名稱：交通中職院校數(shù)字校園建設(shè)研究與實(shí)踐（計(jì)劃編號(hào)：2013T08）。

作者簡介：

汪玨，碩士，浙江交通技師學(xué)院講師，主要研究方向：軟件工程。

龔建偉，浙江交通技師學(xué)院高級講師。

柏鵬，浙江交通技師學(xué)院講師。

賈穎，上海交通大學(xué)軟件學(xué)院在讀研究生。