【導(dǎo)讀】本文首先對(duì)現(xiàn)有的單詞記憶軟件進(jìn)行了市場(chǎng)和技術(shù)上的分析；針對(duì)最新的Web技術(shù)現(xiàn)狀、關(guān)鍵技術(shù)以及各種配套技術(shù)做了詳細(xì)介紹；提出了基于最新Web技術(shù)構(gòu)建單詞記憶軟件的需求分析和總體設(shè)計(jì)。軟件總體實(shí)現(xiàn)是圍繞著屬于Web技術(shù)的HTML5技術(shù)，適應(yīng)未來軟件開發(fā)技術(shù)的方向；數(shù)據(jù)庫(kù)的設(shè)計(jì)來源于NoSQL技術(shù)，可以實(shí)現(xiàn)更高的性能和開發(fā)效率；，使得單詞記憶軟件的客戶端和服務(wù)器端保持了語言的一致性，提高了軟件的代碼復(fù)用能力。本章從單詞記憶軟件的現(xiàn)狀，單詞記憶軟件與最新Web技術(shù)結(jié)合的必要性兩個(gè)方面介紹了畢設(shè)所涉及到的課題背景和研究方向。新的單詞記憶方法和新的Web技術(shù)代替現(xiàn)有的傳統(tǒng)方法和技術(shù)，是適應(yīng)社會(huì)發(fā)展的必然趨勢(shì)。在這一小節(jié)，，然后分析它們當(dāng)前的優(yōu)缺點(diǎn)。

　　

【正文】 服務(wù)器數(shù)據(jù)庫(kù)的邏輯設(shè)計(jì) 服務(wù)器數(shù)據(jù)庫(kù)的邏輯設(shè)計(jì)表序號(hào)字段名數(shù)據(jù)類型字段大小1用戶名字符串202用戶密碼字符串203用戶備份信息字符串— ，其中用戶備份信息是一個(gè)根據(jù)用戶數(shù)據(jù)量大小而改變的量，大小可能達(dá)到數(shù)KB至數(shù)十KB之多，內(nèi)部使用Base64編碼。 數(shù)據(jù)庫(kù)的物理設(shè)計(jì) 客戶端數(shù)據(jù)庫(kù)的物理設(shè)計(jì)客戶端數(shù)據(jù)庫(kù)使用客戶端的數(shù)據(jù)庫(kù)操作模塊（DB）來對(duì)數(shù)據(jù)庫(kù)進(jìn)行增刪查改，客戶端數(shù)據(jù)庫(kù)的物理格式為JavaScript的JSON格式，以NoSQL的思想進(jìn)行保存。生詞本數(shù)據(jù)庫(kù)的物理結(jié)構(gòu)如下：MyBook: { //數(shù)據(jù)庫(kù)名 hello: 1, //一個(gè)單詞，與其是否記憶過的識(shí)別標(biāo)志 what: 1 }單詞書數(shù)據(jù)庫(kù)的物理結(jié)構(gòu)如下：Books: { //數(shù)據(jù)庫(kù)名 考研大綱詞匯: { //一個(gè)單詞書的名稱 abandon: 0, //單詞書中某個(gè)單詞的名稱及其是否記憶過的標(biāo)志 abdomen: 0 }, PETS三級(jí): { abandon: 0, abdomen: 0 } }記憶中數(shù)據(jù)庫(kù)的物理結(jié)構(gòu)如下：Learning: { //數(shù)據(jù)庫(kù)名 hello: [0,0,1359534394535], //單詞名稱，其復(fù)習(xí)次數(shù)，下次復(fù)習(xí)時(shí)間等信息 what: [0,0,1359534394535]}選項(xiàng)設(shè)置數(shù)據(jù)庫(kù)的物理結(jié)構(gòu)如下：Config: { //數(shù)據(jù)庫(kù)名 FirstTimeShow: false, //各種選項(xiàng)設(shè)置的名稱及其鍵值 CurrentBook: 考研大綱詞匯, StudyCount: 25, RandomStudy: true, ReviewAfterStudy: true, AutoUpload: true } 服務(wù)器數(shù)據(jù)庫(kù)的物理設(shè)計(jì)服務(wù)器的數(shù)據(jù)庫(kù)的物理結(jié)構(gòu)如下：{ hi2t33g:{ //一個(gè)隨機(jī)標(biāo)志，用以更快的尋找信息（hash） dqh1 //用戶名項(xiàng)，及其內(nèi)容, password:dqh1, data:some data 1 }, dse342k:{ dqh2, password:dqh2, data:some data 2 }} 服務(wù)器數(shù)據(jù)庫(kù)的每一個(gè)用戶項(xiàng)的索引由一個(gè)不重復(fù)的隨機(jī)值組成，是為了更快的對(duì)數(shù)據(jù)進(jìn)行索引。 本章小結(jié) 本章介紹了課題軟件的數(shù)據(jù)庫(kù)設(shè)計(jì)。數(shù)據(jù)庫(kù)設(shè)計(jì)包括客戶端和服務(wù)器兩方面，客戶端和服務(wù)器都以NoSQL的方式對(duì)數(shù)據(jù)庫(kù)進(jìn)行組織，所以ER圖并不簡(jiǎn)單等同于傳統(tǒng)ER圖，而關(guān)系也只是基本介紹了實(shí)體、屬性和關(guān)系，并不等價(jià)于傳統(tǒng)關(guān)系模式數(shù)據(jù)庫(kù)的ER關(guān)系。 下一張將介紹課題軟件的詳細(xì)設(shè)計(jì)，其中包括算法流程和實(shí)現(xiàn)。第六章 軟件詳細(xì)設(shè)計(jì) 本章在課題軟件的概念設(shè)計(jì)基礎(chǔ)之上，介紹課題軟件的具體算法流程和實(shí)現(xiàn)。 詞典模塊（Dict） 字典模塊主要只有兩部分：（1） 字典的初始化。因?yàn)槌绦虻淖值涫且訪ZMA算法壓縮之后再將二進(jìn)制數(shù)據(jù)用Base64算法轉(zhuǎn)換為字符串存儲(chǔ)的，所以這部分的主要目的是載入這部分壓縮后的字符串，然后用Base64轉(zhuǎn)換回二進(jìn)制，最后再用LZMA算法解壓縮。本課題軟件的LZMA算法模塊是將開源的libzip的源代碼經(jīng)過開源項(xiàng)目emscripten編譯為JavaScript代碼而得到的。壓縮的效率很高，可以將詞庫(kù)壓縮到原來的40%左右大小。主要目的是消耗用戶的CPU時(shí)間來節(jié)省網(wǎng)絡(luò)流量，提高效率。因?yàn)镃PU時(shí)間和網(wǎng)絡(luò)流量時(shí)間都會(huì)降低用戶體驗(yàn)，所以采用這種方法在兩者間取得平和，得到最優(yōu)化的時(shí)間。字典的初始化因?yàn)橐玫浇鈮嚎s算法，而解壓算法整體來說是比較占用CPU資源的，為了保證程序的流暢度，所以字典的初始化是采用了后臺(tái)的多線程工人技術(shù)。（2） 字典的取值。字典的取值，會(huì)根據(jù)一個(gè)單詞，找到其音標(biāo)、詞義和例句，如果沒找到，會(huì)返回一個(gè)JavaScript語言中的未定義值（undefined）。字典模塊的實(shí)現(xiàn)：詞典模塊實(shí)現(xiàn)的主要技術(shù)難度體現(xiàn)在解壓縮所使用的LZMA算法上。LZMA算法針對(duì)的是二進(jìn)制文件，但是在JavaScript中是不能直接表示二進(jìn)制流信息的，所以在進(jìn)入LZMA的函數(shù)之前要將數(shù)據(jù)轉(zhuǎn)換為整型數(shù)組的形式。雖然JavaScript運(yùn)行這種算法的效率整體不高，不過因?yàn)榭梢远嗑€程的處理，可以再兩秒鐘之內(nèi)就完成載入。 對(duì)話框模塊（MessageBox） 對(duì)話框模塊的主要目的是代替JavaScript中提供的alert和confirm函數(shù)。 alert函數(shù)是彈出一個(gè)提示框，而confirm函數(shù)是彈出一個(gè)是否選擇框。之所以重寫一個(gè)對(duì)話框模塊代替這兩個(gè)函數(shù)，是因?yàn)檫@兩個(gè)函數(shù)的作用雖然一樣，但是在不同瀏覽器下的表現(xiàn)不太一樣，顯示效果不一致，也沒辦法通過程序自定義皮膚，故選擇代替這兩個(gè)函數(shù)，達(dá)到更好的界面一致性。 對(duì)話框模塊的實(shí)現(xiàn)： 此模塊的實(shí)現(xiàn)的主要難度在于，alert和confirm函數(shù)是JavaScript自帶函數(shù)，所以在執(zhí)行時(shí)可以暫停JavaScript代碼解釋運(yùn)行，而自己的代碼則無法做到這一點(diǎn)。為了做到這一點(diǎn)，就只能利用事件回調(diào)方法，打開對(duì)話框，只有對(duì)話框關(guān)閉后，才能執(zhí)行下面的代碼。 套接字模塊（Socket） 套接字模塊是使用了Websocket技術(shù)，而進(jìn)行套接字連接的一個(gè)模塊。主要目的是利用Websocket功能，避免HTTP的慢速度，同時(shí)也可以達(dá)到一定的加密效果。 聲音播放模塊（Voice） 聲音模塊是使用了HTML5的Audio標(biāo)簽進(jìn)行發(fā)音的功能，本課題軟件提供mp3和wav兩種音頻格式，可以覆蓋到市場(chǎng)上主流瀏覽器對(duì)于編碼格式的要求。 聲音播放模塊的實(shí)現(xiàn)：聲音模塊實(shí)現(xiàn)主要在于協(xié)調(diào)不同瀏覽器之間的兼容性，不同瀏覽器對(duì)其的支持都不同，所以要做到在各瀏覽器上比較統(tǒng)一的表現(xiàn)比較難。尤其是部分瀏覽器的聲音播放和其他功能執(zhí)行可能產(chǎn)生沖突，例如Chrome如果在聲音播放后有其他窗口操作，那么會(huì)中斷聲音的播放。而在載入窗口時(shí)會(huì)有一個(gè)300毫秒的延遲，所以本軟件將聲音的播放一律延遲350毫秒，以兼容Chrome瀏覽器。 事件模塊（Event） 在之前的章節(jié)說了，Event類主要的目的是為了實(shí)現(xiàn)MVP設(shè)計(jì)模式，其具體的工作流程是： 當(dāng)一個(gè)類A為事件的提供者時(shí)，應(yīng)該使用new Event()。的方法，創(chuàng)建一個(gè)事件，而另一個(gè)類B當(dāng)需要監(jiān)聽這個(gè)事件時(shí)，就要用attach函數(shù)注冊(cè)這個(gè)事件，等待類A中用notify或者wait進(jìn)行通知，以此執(zhí)行類B中的回調(diào)方法。 多線程工人模塊（Work） 本模塊主要應(yīng)用了HTML5的Worker功能。Worker功能可以讓JavaScript代碼在后臺(tái)執(zhí)行，雖然標(biāo)準(zhǔn)未說明這一定要用多線程方法實(shí)現(xiàn)，不過現(xiàn)在主流的瀏覽器都是用多線程方法來實(shí)現(xiàn)Worker功能的，故本人將此模塊起名為多線程工人模塊。 當(dāng)開啟一個(gè)工人時(shí)，就如同開啟了一個(gè)后臺(tái)線程，可以給這個(gè)后臺(tái)線程傳送一個(gè)信息（PostMessage），然后等待這個(gè)工人傳送回信息。 多線程工人模塊的實(shí)現(xiàn)： 工人模塊的實(shí)現(xiàn)主要難點(diǎn)是同步不同線程，本軟件所使用的方法是設(shè)置一個(gè)計(jì)數(shù)變量，每個(gè)線程執(zhí)行之后則對(duì)這個(gè)計(jì)數(shù)變量進(jìn)行計(jì)算，當(dāng)計(jì)數(shù)變量的數(shù)量等同于任務(wù)總數(shù)量時(shí)，就說明所有線程執(zhí)行完成了。JavaScript是不會(huì)出現(xiàn)線程同步的錯(cuò)誤的，因?yàn)镴avaScript是單線程語言，其他JavaScript線程空間雖然可以發(fā)送消息回調(diào)主線程的處理函數(shù)，但是并不會(huì)出現(xiàn)其他語言中可能遇到的線程沖突問題。 主模塊的主要功能是載入各種其他模塊并顯示程序主界面，主要流程解釋如下：（1） 當(dāng)程序開始運(yùn)行時(shí)，首先會(huì)載入程序主頁面。主要算法就存在于此頁面。載入此頁面的的過程中會(huì)運(yùn)行此頁面中的JavaScript程序代碼，從而開始對(duì)整個(gè)程序的初始化。（2） 初始化的第一步是載入第三方模塊，即jQuery。他們的是其他模塊的基礎(chǔ)。這三個(gè)主要的模塊的大小也是比較小的。（3） 在載入了第三方模塊之后，就已經(jīng)有足夠的庫(kù)文件支持來顯示對(duì)話框了，所以此時(shí)顯示“載入中”對(duì)話框，提醒用戶程序正在初始化。（4） 如果載入中途失敗，出現(xiàn)某些錯(cuò)誤，則提醒用戶載入出錯(cuò)，無法繼續(xù)。如果載入成功，就繼續(xù)初始化數(shù)據(jù)。（5） 初始化數(shù)據(jù)主要指初始化顯示主界面所需要的一些數(shù)據(jù)，主要有：a) 判斷是否能夠自動(dòng)登錄，如能夠，則自動(dòng)登錄。b) 。c) 下載在線服務(wù)器的名言例句文件，隨機(jī)從中選擇一條。d) 判斷當(dāng)前用戶詞庫(kù)的狀態(tài)，是可以復(fù)習(xí)，還是可以初記，亦或是什么都不能做（這三種可能性都有可能，原因是因?yàn)橛脩舯痴b的進(jìn)度等因素），按照相應(yīng)的情況設(shè)置主界面開始按鈕顯示的文字。（6） 顯示界面的步驟主要是注冊(cè)各種界面的事件，初始化按鈕的輔助信息提示窗等內(nèi)容。（7） 如果程序是第一次運(yùn)行，則在主界面的程序標(biāo)題處，播放一個(gè)暫短的程序使用簡(jiǎn)介動(dòng)畫，通過滾動(dòng)不同的文字信息，來提示用戶本軟件的主要功能。（8） 完成初始化，等待用戶的下一步指令。主模塊主要的難點(diǎn)是各種模塊的載入順序與兼容性問題，例如Internet Explorer瀏覽器載入CSS樣式文件必須在HTML文件的head模塊中，否則會(huì)載入失敗，而其他例如Firefox和Chrome瀏覽器都可以在任意位置載入。還有就是本程序的各模塊組之間使用的是順序載入，例如必須把所有詞典模塊都載入后才能解壓縮，此時(shí)必須利用JavaScript的事件方法，先去執(zhí)行其他部分，待等到所有需要的部分載入完成之后，再執(zhí)行此部分的任務(wù)。 程序運(yùn)行流程圖登錄函數(shù) 登錄函數(shù)也是主模塊中的一個(gè)重要功能，提供自動(dòng)登錄，手動(dòng)登錄等功能，流程解釋如下：（1） 開始嘗試自動(dòng)登錄（2） 判斷本地?cái)?shù)據(jù)庫(kù)中是否有自動(dòng)登錄所需要的用戶名和密碼信息。如果有則繼續(xù)登錄，如果沒有則停止自動(dòng)登錄，等待用戶手動(dòng)登錄。（3） 通過html提供的函數(shù)判斷當(dāng)前是否聯(lián)網(wǎng)在線，如果沒有，且是手動(dòng)登陸，應(yīng)該提醒用戶。（4） 向服務(wù)器提交登錄信息（5） 通過服務(wù)器返回的信息判斷是否登錄成功，如果失敗，則提醒用（6） 完成登錄 登陸函數(shù)流程圖 上層模塊的詳細(xì)設(shè)計(jì) 初記模塊 初記模塊的作用是完成初記功能，因?yàn)镋bbinghaus的記憶曲線的第一個(gè)時(shí)間點(diǎn)最短只有1分鐘，所以最好的方法是初記后立刻復(fù)習(xí)。，詳細(xì)說明如下：（1） 在主模塊可以初記的情況下，點(diǎn)擊開始初記按鈕，進(jìn)入初記流程（2） 判斷是否可以初記，即要么生詞本中有未初記的單詞，要么有當(dāng)前詞庫(kù)，且里面的單詞足夠初記。（3） 如果能初記，則取出要初記的單詞（4） 取出要初記的單詞列表中的一個(gè)單詞，取出單詞響應(yīng)信息。同時(shí)彈出聯(lián)想圖片搜索的對(duì)話框。（5） 等待用戶輸入正確的單詞，完成初記（6） 判斷用戶輸入單詞是否正確，不正確就抖動(dòng)顯示的單詞，提醒用戶輸入錯(cuò)誤。正確的話就判斷當(dāng)前是否可以完成初記。（7） 如果當(dāng)前完成了初記，也就是對(duì)每個(gè)單詞都輸入了或者跳過了，完成初記就將初記的單詞信息寫入記憶中數(shù)據(jù)庫(kù)。（8） 判斷是否用戶在設(shè)置中選擇初記后直接復(fù)習(xí)，如果選擇復(fù)習(xí)就跳轉(zhuǎn)到復(fù)習(xí)頁面，否則就跳轉(zhuǎn)回主頁面。 初記模塊運(yùn)行流程圖取單詞函數(shù) 在初記模塊中判斷能否初記之后，最開始執(zhí)行的則是取單詞函數(shù)，要將數(shù)據(jù)庫(kù)中可以學(xué)習(xí)的單詞取出，打亂順序，最終顯示給用戶，詳細(xì)解釋如下：（1） 打開單詞數(shù)據(jù)庫(kù)，準(zhǔn)備取出單詞（2） 從其中取出一個(gè)單詞（3） 判斷此單詞是否未學(xué)，如果未學(xué)則繼續(xù)，如果已學(xué)了，則返回上一步（4） 判斷是否達(dá)到本次學(xué)習(xí)要求的單詞數(shù)目，如果是則繼續(xù)，如果不是則再取出單詞（5） 將取出的單詞打亂順序（6） 判斷本地緩存中是否有取出的單詞的語音數(shù)據(jù)，如果沒有，則訪問遠(yuǎn)程服務(wù)器下載（7） 開始學(xué)習(xí) 初記模塊取單詞函數(shù)流程圖 復(fù)習(xí)模塊 復(fù)習(xí)模塊的主要作用是實(shí)現(xiàn)單詞復(fù)習(xí)功能，就是對(duì)已經(jīng)學(xué)習(xí)了的單詞按照Ebbinghaus記憶曲線進(jìn)行復(fù)習(xí)，也就是用重復(fù)記憶的方法，達(dá)到單詞的記憶效果。，詳細(xì)的流程解釋為：（1） 當(dāng)主模塊判斷有可復(fù)習(xí)的單詞，然后用戶點(diǎn)擊開始復(fù)習(xí)后，即進(jìn)入復(fù)習(xí)模塊（2） 首先判斷是否要有必要進(jìn)行復(fù)習(xí)，也就是記憶中數(shù)據(jù)庫(kù)中是否有單詞的下次時(shí)間到了（3） 讀取所有要復(fù)習(xí)的單詞到本模塊，并賦予初始分值。每個(gè)單詞一共得10分就完成復(fù)習(xí)，如果單詞的錯(cuò)誤次數(shù)較少則說明用戶對(duì)此單詞掌握的比較好，則初始分?jǐn)?shù)較高，否則初始分?jǐn)?shù)為0。（4） 讀取并在屏幕上顯示要復(fù)習(xí)的單詞中的第一個(gè)。（5） 等待用戶輸入單詞并提交，判斷用戶輸入的單詞正確與否。如果正確則加分，如果錯(cuò)誤，則提示用戶回答錯(cuò)誤，待用戶再次輸入正確單詞后不本次加分。無論正確還是錯(cuò)誤，這個(gè)單詞到會(huì)插入到后續(xù)單詞列表中的一個(gè)隨機(jī)位置上。（6） 判斷單詞列表現(xiàn)在是否為空，即是否已經(jīng)完成了復(fù)習(xí)。 復(fù)習(xí)模塊運(yùn)行流程圖 單詞書模塊 單詞書模塊是管理單詞書的模塊，可以在線添加單詞書，添加本地單詞書，對(duì)單詞書進(jìn)行查詢，重置，刪除等操作的地方。 ，流程解釋為：（1） 根據(jù)用戶操作，從主模塊打開單詞書模塊，并初始化顯示單詞書界面（2） 一方面從遠(yuǎn)程下載單詞書列表，另一方面讀取本地的單詞書（3） 計(jì)算單詞書中已經(jīng)學(xué)過的單詞（4） 顯示單詞書表格，供用戶操作 單詞書模塊運(yùn)行流程圖載入本地單詞書函數(shù)：，解釋如下：（1） 用戶通過選擇本地單詞書（或者通過本地文件管理將單詞書拖入窗口位置）（2） 通過HTML5新加入的本地文件處理函數(shù)讀取單詞書文件中的信息（3） 計(jì)算單詞書文件中的可加入單詞（4） 提示用戶是否加入（5） 如果加入成功，則刷新單詞書顯示列表 載入本地單詞書函數(shù)流程圖 生詞本模塊 生詞本模塊的主要作用是讓用戶能手動(dòng)添加、查詢、刪除單詞。而生詞本中的單詞因?yàn)闀?huì)優(yōu)先于單詞