基于CDIO模式的jQuery課程實(shí)驗(yàn)設(shè)計

吳杰 梁妍 馬馳

摘要：本文闡述了jQuery課程實(shí)驗(yàn)為設(shè)計目標(biāo)，將CDIO工程教育改革的新模式引入軟件工程專業(yè)相關(guān)課程的過程。在jQuery課程的實(shí)驗(yàn)教學(xué)和課程教學(xué)的設(shè)計過程中，將案例教學(xué)模式進(jìn)一步提升為CDIO教學(xué)模式，促使學(xué)生深入理解所學(xué)知識點(diǎn)在工程中的實(shí)際應(yīng)用，同時也為軟件工程專業(yè)完成以“卓越工程師教育培養(yǎng)計劃”為目標(biāo)的改革提供了參考思路。

關(guān)鍵詞：CDIO;實(shí)驗(yàn)設(shè)計;jQuery課程

中圖分類號：G642.41? ? ?文獻(xiàn)標(biāo)志碼：A? ? ?文章編號：1674-9324（2019）11-0271-03

一、引言

進(jìn)20年來，軟件開發(fā)（尤其是Web開發(fā)）及相關(guān)行業(yè)發(fā)展迅速，軟件相關(guān)技術(shù)的應(yīng)用已經(jīng)應(yīng)用到工作和生活中的各個方面，軟件公司對人才的需求每年以20%左右的速度遞增[1]。經(jīng)過近20年的發(fā)展，國內(nèi)各個大學(xué)基本都開設(shè)了軟件工程、計算機(jī)科學(xué)與技術(shù)等相關(guān)專業(yè)。但是，在教學(xué)過程中，常常由于缺乏實(shí)際工程項(xiàng)目的訓(xùn)練，學(xué)生實(shí)踐能力社會發(fā)展不相適應(yīng)，導(dǎo)致了一方面國內(nèi)軟件行業(yè)用人緊缺，另一方面網(wǎng)絡(luò)工程、軟件工程、計算機(jī)科學(xué)與技術(shù)等計算機(jī)相關(guān)專業(yè)學(xué)生就業(yè)形勢嚴(yán)峻。

CDIO工程教育模式是一種新型教學(xué)模式，主要面向工程類的學(xué)生教育。CDIO教學(xué)模式的核心是強(qiáng)調(diào)學(xué)生的自主學(xué)習(xí)，強(qiáng)調(diào)專業(yè)中各個課程的關(guān)聯(lián)性和專業(yè)的整體性，強(qiáng)調(diào)教學(xué)中學(xué)生參與實(shí)踐和實(shí)驗(yàn)的過程。具體到軟件工程學(xué)科的各門課程，需要在CDIO的框架下，提出可操作的教學(xué)大綱和培養(yǎng)方案，對傳統(tǒng)教學(xué)中的問題進(jìn)行改善。目前，全世界的各個著名高校都有了基于CDIO的教學(xué)實(shí)踐和實(shí)驗(yàn)，培養(yǎng)的學(xué)生更符合社會和企業(yè)的需求，取得了良好的效果[2]。

CDIO教學(xué)模式面向的是工程類型的學(xué)生教育，強(qiáng)調(diào)將教學(xué)中的知識點(diǎn)融入到工程實(shí)驗(yàn)中，不僅是對課程知識點(diǎn)的教學(xué)，還要培養(yǎng)學(xué)生對知識點(diǎn)舉一反三的能力、分析解決新問題的能力和工作態(tài)度等隱性能力，需要做到理論教學(xué)配合實(shí)驗(yàn)教學(xué)，二者進(jìn)行有機(jī)結(jié)合設(shè)計。對于軟件工程專業(yè)課程中的知識點(diǎn)和能力培養(yǎng)方案，應(yīng)該有對應(yīng)的實(shí)驗(yàn)建設(shè)體系、課程內(nèi)容和教學(xué)方法，在實(shí)驗(yàn)教學(xué)環(huán)節(jié)，要盡量貼近真實(shí)的工程開發(fā)和實(shí)踐過程，實(shí)現(xiàn)探究式科學(xué)教育。

二、CDIO模式下的jQuery課程實(shí)驗(yàn)教學(xué)設(shè)計

jQuery是一個基于JavaScript語言的開源開發(fā)框架，它通過自身API的封裝，整合了各個不同瀏覽器的原生DOM方法。隨著jQuery不斷的開發(fā)升級，jQuery已經(jīng)具備了強(qiáng)大功能，成為使用JavaScript開發(fā)網(wǎng)頁事實(shí)上的標(biāo)準(zhǔn)。因此，jQuery課程成為軟件工程專業(yè)的一門必修課程。為了能在教學(xué)中讓學(xué)生更好的把握jQuery的知識點(diǎn)，并且可以在實(shí)驗(yàn)環(huán)節(jié)培養(yǎng)學(xué)生的工程實(shí)踐能力，必須根據(jù)該課程自身的特點(diǎn)，改革實(shí)驗(yàn)教學(xué)的方式。

通過實(shí)際調(diào)研，jQuery技術(shù)主要應(yīng)用于網(wǎng)頁開發(fā)，就業(yè)崗位有前端工程師和全棧工程師等。根據(jù)工程實(shí)際和工作崗位分析，可將jQuery課程實(shí)驗(yàn)分為8個模塊，每一個模塊對應(yīng)一項(xiàng)崗位技能。

第一個模塊是實(shí)際項(xiàng)目原型系統(tǒng)界面設(shè)計。教學(xué)目標(biāo)為：（1）理解項(xiàng)目的完整業(yè)務(wù)。（2）項(xiàng)目的界面設(shè)計方法。（3）項(xiàng)目的頁面整體布局。（4）理解項(xiàng)目的頁面樣式。（5）理解項(xiàng)目的基本特效設(shè)計。設(shè)計學(xué)時共4個學(xué)時。

第二個模塊是面向?qū)ο蟮腏avascript。教學(xué)目標(biāo)為：（1）了解面向?qū)ο蟮腏avascript開發(fā)標(biāo)準(zhǔn)。（2）了解JS對象的基本組成形式。（3）理解JS的各種內(nèi)建對象和使用方法。（4）了解JS的對象模型，對象構(gòu)建原理。設(shè)計學(xué)時共8個學(xué)時。

第三個模塊是jQuery簡介。教學(xué)目標(biāo)為：（1）了解常用的JS框架。（2）會開發(fā)基于Jquery框架的DHTML頁面。（3）了解Jquery的基本對象。（4）理解Jquery對于DOM對象的訪問方法。（5）了解Jquery常用開發(fā)工具和插件。設(shè)計學(xué)時共6個學(xué)時。

第四個模塊是jQuery選擇器。教學(xué)目標(biāo)為：（1）了解Jquery的部件組成。（2）理解Jquery的各種選擇器。（3）理解Jquery選擇器的基本使用方法。設(shè)計學(xué)時共8個學(xué)時。

第五個模塊是jQuery的DOM操作。教學(xué)目標(biāo)為：（1）了解DOM解析的常用方法。（2）理解DOM節(jié)點(diǎn)元素的訪問方法。（3）理解DOM節(jié)點(diǎn)屬性的訪問方法。

（4）理解DOM節(jié)點(diǎn)對于動態(tài)網(wǎng)頁的構(gòu)建方法。設(shè)計學(xué)時共6個學(xué)時。

第六個模塊是事件與動畫。教學(xué)目標(biāo)為：（1）理解Jquery的事件處理流程。（2）會使用基本的Jquery事件和事件處理。（3）理解Jquery的動畫工作原理。（4）會使用基本的Jquery動畫。（5）了解如何構(gòu)建Jquery自定義動畫。設(shè)計學(xué)時共12個學(xué)時。

第七個模塊是JQuery與Ajax應(yīng)用。教學(xué)目標(biāo)為：

（1）了解AJAX技術(shù)的本質(zhì)。（2）理解AJAX中的訪問對象。（3）會執(zhí)行和操作AJAX對象的基本屬性。（4）會利用Jquery執(zhí)行AJAX訪問。（5）理解JSON數(shù)據(jù)格式的意義。（6）理解JSON數(shù)據(jù)格式的組成。設(shè)計學(xué)時共12個學(xué)時。

第八個模塊是插件與特效。教學(xué)目標(biāo)為：（1）了解Jquery插件的意義。（2）會植入常用的Jquery插件，并執(zhí)行操作。（3）能夠使用模態(tài)窗口插件。（4）了解Jquery插件的基本編寫流程。設(shè)計學(xué)時共12個學(xué)時。

以往jQuery實(shí)驗(yàn)各個模塊相互獨(dú)立，聯(lián)系不足。改革后的實(shí)驗(yàn)設(shè)計改變了的原有實(shí)驗(yàn)的設(shè)計思路，將“防雷中心微信服務(wù)管理平臺項(xiàng)目”有機(jī)的融入到課程實(shí)驗(yàn)中，將“防雷中心微信服務(wù)管理平臺項(xiàng)目”分解為8個實(shí)驗(yàn)?zāi)K，每個模塊分別實(shí)現(xiàn)“防雷中心微信服務(wù)管理平臺項(xiàng)目”的部分功能。圖1是jQuery課程實(shí)驗(yàn)教學(xué)整體設(shè)計的示意圖。

三、CDIO工程教育模式下對實(shí)驗(yàn)教學(xué)項(xiàng)目進(jìn)行迭代的改革

在軟件開發(fā)行業(yè)，企業(yè)用人的考核條件不僅僅局限于畢業(yè)生的學(xué)歷，而且更注重錄用人員的實(shí)際項(xiàng)目經(jīng)驗(yàn)和工作能力、態(tài)度等綜合能力。因此，jQuery課程實(shí)驗(yàn)的培養(yǎng)目標(biāo)也應(yīng)該包括培養(yǎng)學(xué)生項(xiàng)目開發(fā)能力和自主解決問題的能力[3]。

CDIO工程教育模式注重學(xué)習(xí)的整個流程，要求學(xué)生在實(shí)驗(yàn)過程中不斷的對項(xiàng)目進(jìn)行迭代和反思，通過實(shí)驗(yàn)的迭代，讓學(xué)生深入理解知識及課程的重點(diǎn)?；贑DIO的教學(xué)法具體實(shí)施步驟如下：

第一階段：知識點(diǎn)學(xué)習(xí)。教師指導(dǎo)學(xué)生對實(shí)驗(yàn)的基本知識點(diǎn)進(jìn)行快速學(xué)習(xí)，目的是掌握整個課程的體系結(jié)構(gòu)，在此階段，可以不對實(shí)驗(yàn)細(xì)節(jié)和實(shí)驗(yàn)難點(diǎn)進(jìn)行講解。該階段的教學(xué)目的是讓了解實(shí)驗(yàn)項(xiàng)目，并建立知識點(diǎn)和實(shí)驗(yàn)項(xiàng)目之間的關(guān)聯(lián)，以便在今后的教學(xué)中，對知識點(diǎn)學(xué)習(xí)。

第二階段：項(xiàng)目實(shí)踐。在第一階段的基礎(chǔ)上，學(xué)生運(yùn)用以前續(xù)課程的內(nèi)容和技術(shù)自主完成實(shí)驗(yàn)，將實(shí)驗(yàn)內(nèi)容盡可能地完成，并且列出設(shè)計中已用使用知識點(diǎn)與改進(jìn)迭代使用知識點(diǎn)對比大綱。在此階段，可以讓學(xué)生明確所學(xué)知識點(diǎn)，以及該知識點(diǎn)在項(xiàng)目中的實(shí)施效果，為下一階段教學(xué)打好基礎(chǔ)。

第三階段：項(xiàng)目學(xué)習(xí)反饋。學(xué)生將實(shí)驗(yàn)中不能完成的功能反饋給實(shí)驗(yàn)教師。教師引導(dǎo)學(xué)生完成功能或組織學(xué)生進(jìn)行研討。對于普遍發(fā)生的問題，教師在理論課程中進(jìn)行集中答疑和代碼示范。通過本階段學(xué)習(xí)，學(xué)生基本能掌握課程全部知識和技能，解決第二階段中的難點(diǎn)和疑點(diǎn)。

第四階段：項(xiàng)目迭代。學(xué)生在第二階段實(shí)驗(yàn)項(xiàng)目的基礎(chǔ)上，對項(xiàng)目的代碼進(jìn)行迭代，將第二階段的項(xiàng)目代碼補(bǔ)充完成，作為最終成果物提交。通過本階段的學(xué)習(xí)，學(xué)生可以全面掌握教學(xué)知識點(diǎn)，將教學(xué)知識點(diǎn)和項(xiàng)目融合。

第五階段：總結(jié)。在第四階段完成后，學(xué)生需要撰寫實(shí)驗(yàn)報告和實(shí)驗(yàn)總結(jié)。投稿本階段的學(xué)習(xí)，學(xué)生可完成知識和技能的累積，總結(jié)學(xué)習(xí)方法。

CDIO模式的實(shí)驗(yàn)教學(xué)方法側(cè)重快速迭代學(xué)習(xí)和自我學(xué)習(xí)，學(xué)生在這種模式下可以抓住學(xué)習(xí)重點(diǎn)，把握各個知識點(diǎn)學(xué)習(xí)的深度標(biāo)準(zhǔn)，避免學(xué)生學(xué)習(xí)鉆牛角尖或淺嘗輒止的現(xiàn)象產(chǎn)生。

四、教學(xué)改革效果

通過CDIO模式的jQuery課程實(shí)驗(yàn)改革的實(shí)施，遼寧科技大學(xué)jQuery相關(guān)教學(xué)效果有明顯改進(jìn)。表1是教改前后jQuery課程成績的分析表格，2016學(xué)年為教改前成績，2017學(xué)年和2018學(xué)年為教改后成績。

五、總結(jié)

教學(xué)改革任務(wù)一般艱巨并難于把握，需要教師在長時間積累后，進(jìn)一步開放思路，求實(shí)創(chuàng)新。在長期的教學(xué)實(shí)踐中，我們發(fā)現(xiàn)在CDIO教學(xué)體系結(jié)構(gòu)下，對jQuery課程的改革適應(yīng)了新形勢下社會的需求。

參考文獻(xiàn)：

[1]宋宏偉，吳愛燕，回文博，等.構(gòu)建培養(yǎng)應(yīng)用型程序設(shè)計人才的教學(xué)機(jī)制——C語言程序設(shè)計的教學(xué)改革與實(shí)踐[J].石家莊學(xué)院學(xué)報，2008，（3）：125-128.

[2]朱玉.CDIO工程理念在“機(jī)械原理課程設(shè)計”教學(xué)中的應(yīng)用[J].中國電力教育，2010，（1）：139-140.

[3]潘懋元.新編高等教育學(xué)[M].北京：北京師范大學(xué)出版社，2006：291-293.

Experiment Design of jQuery Course Based on CDIO Model

WU Jie1，LIANG Yan2，MA Chi1

（1.School of Software，University of Science and Technology Liaoning，Anshan，Liaoning 114051，China;

2.School of Applied Technology，University of Science and Technology Liaoning，Anshan，Liaoning 114051，China）

Abstract：Taking the jQuery curriculum experiment as the design objective，this paper expounds the process of introducing the new mode of CDIO engineering education reform into the related courses of software engineering specialty.In the design of experimental teaching and course teaching in the jQuery course，the case teaching model is further promoted to the CDIO teaching model，which encourages students to understand the practical application of the knowledge points in the project，and also provides a reference for the reform goal of the "Excellent Engineer Education Cultivation Plan" for the software engineering specialty.

Key words：CDIO;experiment design;jQuery course