JavaScript教學(xué)方法淺析

徐華珍 宋偉 姚冬虎 孫佳慧

摘 要

JavaScript語言是目前因特網(wǎng)流行的網(wǎng)絡(luò)腳本語言，是網(wǎng)頁設(shè)計(jì)的核心技術(shù)之一。JavaScript作為計(jì)算機(jī)專業(yè)的一門專業(yè)技能課，旨在培養(yǎng)學(xué)生動(dòng)態(tài)網(wǎng)頁設(shè)計(jì)制作的專業(yè)技術(shù)基礎(chǔ)能力。本文中筆者結(jié)合教學(xué)實(shí)踐，分別從理論教學(xué)和實(shí)驗(yàn)教學(xué)兩個(gè)環(huán)節(jié)，針對(duì)采用的對(duì)比講授法、案例分析法、任務(wù)驅(qū)動(dòng)法進(jìn)行了探析。

關(guān)鍵詞

JavaScript;對(duì)比講授法;案例分析法;任務(wù)驅(qū)動(dòng)法

中圖分類號(hào)： ?TP319 ? ? ? ? ? ? ? ? ? ? ? ?文獻(xiàn)標(biāo)識(shí)碼： A

DOI：10.19694/j.cnki.issn2095-2457.2020.07.012

Abstract

JavaScript is a popular Internet scripting language and one of the core technologies of web page design.As a professional skill course of computer major，JavaScript aims to cultivate students' professional and technical basic ability of dynamic web design and production.In this paper，combining with teaching practice，the author analyzes and discusses the comparative teaching method，case analysis method and task driven method from two aspects of theoretical teaching and experimental teaching.

Key Words

Javascript;Comparative teaching method;Case analysis method;Task driven method

JavaScript是NetScape公司開發(fā)的一種基于對(duì)象的解釋性腳本語言，能實(shí)現(xiàn)網(wǎng)頁內(nèi)容的交互顯示。具有簡單、安全、動(dòng)態(tài)、跨平臺(tái)等特點(diǎn)。學(xué)習(xí)本門語言需先對(duì)html語言有所了解，為了幫助學(xué)生更好地理解，筆者在教學(xué)過程中采用了對(duì)比講授法，使得學(xué)生能輕松地掌握J(rèn)avaScript語言的獨(dú)到之處，并運(yùn)用案例加以鞏固，引導(dǎo)學(xué)生發(fā)現(xiàn)問題、分析問題，實(shí)踐課上注重學(xué)生動(dòng)手編程能力的培養(yǎng)，取得了非常好的效果。

1 理論教學(xué)

理論知識(shí)的學(xué)習(xí)是枯燥的，如何引導(dǎo)學(xué)生有效地思考問題，輕松掌握語言的特點(diǎn)和運(yùn)用技巧，激起對(duì)語言的學(xué)習(xí)興趣實(shí)屬關(guān)鍵。

1.1 對(duì)比講授法

考慮到JavaScript對(duì)于學(xué)生而言是一門新的語言，鑒于他們已經(jīng)學(xué)習(xí)過C語言和Java語言，于是在JavaScript課程的講解中穿插著與這兩門語言的比較，這樣學(xué)生理解起來不會(huì)太空洞、抽象，同時(shí)還能加深之前所學(xué)語言的印象。

1.1.1 與Java的異同

JavaScript是Sun與Netscape公司聯(lián)合推出的，同Java語言都具有對(duì)象的概念，邏輯運(yùn)算符、語法結(jié)構(gòu)相類似。主要區(qū)別在于：Java語言是面向?qū)ο蟮恼Z言，而JavaScript是基于對(duì)象，比如它沒有繼承、多態(tài)的特征，沒有類的概念;執(zhí)行方式不一樣。Java先經(jīng)過編譯再解釋執(zhí)行，而JavaScript是解釋執(zhí)行;Java采用強(qiáng)類型變量檢查，而JavaScript變量則屬于弱變量;功能實(shí)現(xiàn)不一樣。Java通過Java虛擬機(jī)實(shí)現(xiàn)程序功能，而JavaScript通過瀏覽器實(shí)現(xiàn)程序功能。

1.1.2 與C語言的異同

JavaScript語言與C語言的某些詞法、語法相同。比如運(yùn)算符，關(guān)鍵字以及函數(shù)調(diào)用的語法等處。主要區(qū)別在于：C語言是面向過程語言，而JavaScript語言是基于對(duì)象的腳本語言;C語言是靜態(tài)類型語言，即程序運(yùn)行之前每個(gè)變量的數(shù)據(jù)類型就已經(jīng)確定，而JavaScript是動(dòng)態(tài)類型語言，其數(shù)據(jù)類型在運(yùn)行時(shí)仍可變化;C語言管理內(nèi)存需要程序員手動(dòng)管理，而JavaScript的內(nèi)存是由解釋器來管理。

在每講一個(gè)知識(shí)點(diǎn)，帶領(lǐng)學(xué)生回顧C(jī)語言和Java語言中相對(duì)應(yīng)的知識(shí)點(diǎn)，最典型的比較案例是輸出語句，比如你吃飯了嗎，在Java語言是這樣編寫的：system.out.print（“你吃飯了嗎？”）;在C語言中寫成printf（“你吃飯了嗎？”）;而JavaScript語言則是document.write（“你吃飯了嗎？”）。通過穿插對(duì)比講解，學(xué)生比較容易接受。

1.2 案例分析法

JavaScript課程實(shí)踐性比較強(qiáng)，如果純粹給學(xué)生“灌輸”理論知識(shí)，學(xué)生會(huì)感到乏味，而通過案例展示，不但讓學(xué)生眼前一亮，增加趣味性，還有助于學(xué)生對(duì)知識(shí)點(diǎn)的掌握。在理論課堂上一邊編寫代碼一邊給學(xué)生解釋，通過瀏覽器打開編寫好的網(wǎng)頁，運(yùn)行出結(jié)果。比如在講解鼠標(biāo)事件的時(shí)候，可先向?qū)W生展示需要完成的效果，如下圖1、圖2所示。

通過效果圖激發(fā)學(xué)生的興趣，再引導(dǎo)學(xué)生思考，運(yùn)用所學(xué)知識(shí)點(diǎn)實(shí)現(xiàn)，最終與學(xué)生共同完成代碼，其關(guān)鍵代碼如下：

function bigImg（x） {

x.style.height = "64px";

x.style.width = "64px";

}

function normalImg（x） {

x.style.height = "32px";

x.style.width = "32px";

}

2 實(shí)驗(yàn)教學(xué)

2.1 任務(wù)驅(qū)動(dòng)法

再多的理論如果沒有自己親自動(dòng)手實(shí)踐加深理解，都將會(huì)是紙上談兵，只有不斷地上機(jī)操作實(shí)現(xiàn)，才會(huì)更好地掌握知識(shí)點(diǎn)，提升自己的技能。

在實(shí)驗(yàn)教學(xué)中，主要采用“實(shí)例引導(dǎo)，項(xiàng)目驅(qū)動(dòng)”的方式講授常用軟件的使用，通過實(shí)現(xiàn)相關(guān)實(shí)例，在實(shí)例基礎(chǔ)上改造拓寬，幫助學(xué)生真正實(shí)現(xiàn)“學(xué)以致用”。

在實(shí)驗(yàn)課上，先布置任務(wù)給學(xué)生，當(dāng)然學(xué)生也可以根據(jù)所學(xué)自己提出實(shí)現(xiàn)案例。在布置任務(wù)時(shí)，筆者先給學(xué)生分析任務(wù)，對(duì)實(shí)現(xiàn)思路予以提示，引導(dǎo)學(xué)生獨(dú)立思考問題，鼓勵(lì)學(xué)生勤動(dòng)手。在學(xué)生完成過程中，對(duì)出現(xiàn)的困惑加以解答，使學(xué)生自主完成任務(wù)。比如實(shí)現(xiàn)一個(gè)簡易的計(jì)算器，先分析要求，運(yùn)用html5的知識(shí)對(duì)頁面進(jìn)行排版布局，再添加表單元素（text，button），響應(yīng)鼠標(biāo)事件，以及實(shí)現(xiàn)輸入，最終運(yùn)行結(jié)果回顯至文本框，需運(yùn)用到DOM知識(shí)點(diǎn)等。提示完學(xué)生，學(xué)生按照要求進(jìn)行完成，在實(shí)現(xiàn)過程中，有疑問的地方舉手詢問。運(yùn)用此種教學(xué)方法，大約80%的學(xué)生能按時(shí)完成任務(wù)，完成質(zhì)量較好，當(dāng)然還有極少部分學(xué)生因基礎(chǔ)太薄弱不能獨(dú)立完成，需課后多指導(dǎo)。

3 總結(jié)

JavaScript是學(xué)習(xí)網(wǎng)頁前端設(shè)計(jì)（html，CSS，JavaScript）必不可少的知識(shí)之一，網(wǎng)頁前端的重要性不言而喻，作為一名老師，如何做好這門課程的傳道授業(yè)解惑，一直是我們所關(guān)心和思考的。本文就筆者在經(jīng)歷幾屆教學(xué)經(jīng)驗(yàn)基礎(chǔ)上，對(duì)自己平時(shí)授課所采取的幾種方法進(jìn)行了簡單的探析，通過運(yùn)用這些方法，取得了比較好的效果。當(dāng)然講課的方式方法還有很多，筆者也在不斷學(xué)習(xí)摸索中，期望能挖掘出更合適的方法，更好地提升學(xué)生的知識(shí)水平以及動(dòng)手能力。

參考文獻(xiàn)

[1]張欣悅.翻轉(zhuǎn)課堂在基于JavaScript的網(wǎng)頁特效教學(xué)中的應(yīng)用[J].信息與電腦（理論版），2018（03）：238-240.

[2]黃偉.Web前端開發(fā)技術(shù)及其優(yōu)化研究[J].電腦知識(shí)與技術(shù)，2019，15（30）：257-258.