基于HTML5 JavaScript的射擊類游戲設(shè)計與實現(xiàn)

摘要隨著HTML5的誕生，一系列的新特性也隨之出現(xiàn)，而我認(rèn)為最為核心的特性莫過于它的跨平臺兼容性了。它不單單能夠在計算機上運行,而且能夠在移動端上運行。除此之外，HTML5中的Canvas元素允許瀏覽器直接創(chuàng)建以及處理圖像,這在讓開發(fā)人員更加輕松的同時,也使得界面更加好看,讓用戶擁有了更加良好的體驗,大大縮短了用戶加載的時間。正因為這種種的優(yōu)點,讓HTML5獲得了更多的贊同。基于HTML5的游戲已經(jīng)成為了一個比較熱門的研究課題。本文首先從整體上介紹了HTML5的研究現(xiàn)狀，然后敘述出本次課題研究的目的以及意義，分析了本次游戲所用到的相關(guān)技術(shù)。游戲系統(tǒng)主要通過設(shè)置主體物、障礙物、計時器等，實現(xiàn)由主物體射擊、障礙物觸發(fā)邊界會加速反彈、主體物躲避障礙物等功能。主要運用了HTML5、CSS、JavaScript等技術(shù)，在Windows10的軟件環(huán)境以及通過AdobeDreamweave開發(fā)工具下進行。關(guān)鍵詞：HTML5CSSJavaScriptAdobeDreamweave射擊類游戲Abstract\o"添加到收藏夾"WiththebirthofHTML5,aseriesofnewfeatureshaveemerged,andIthinkthemostcorefeatureisitscrossplatformcompatibility.Itcanrunnotonlyonthecomputer,butalsoonthemobileend.Inaddition,thecanvaselementinHTML5allowsthebrowsertodirectlycreateandprocessimages,whichmakesthedeveloperseasier,butalsomakestheinterfacemorebeautiful,makestheuserhaveabetterexperience,andgreatlyshortenstheuserloadtime.Becauseoftheseadvantages,HTML5hasgainedmoreapproval.ThegamebasedonHTML5hasbecomeahotresearchtopic.ThearticlefirstintroducesthecurrentresearchstatusofHTML5asawhole,thendescribesthepurposeandsignificanceofthisresearch,andanalyzestherelevanttechnologiesusedinthisgame.Themainfunctionofthegamesystemistoshootbythemainobject,triggertheboundaryoftheobstacle,acceleratethereboundandavoidtheobstaclebysettingthemainobject,obstacleandtimer.MainlyusedHTML5,CSS,JavaScriptandothertechnologies,inthewindows10softwareenvironmentandthroughAdobeDreamweavedevelopmenttools.Keywords:HTML5CSSJavaScriptAdobeDreamweaveShootinggames

目錄TOC\o"1-3"\h\u第一章緒論 第一章緒論1.1課題研究現(xiàn)狀隨著經(jīng)濟的快速發(fā)展，人們對精神方面的追求日益提高。他們不再只是對笨拙的臺式計算機上工作感到滿意，反而更加喜歡去使用移動設(shè)備。在網(wǎng)頁設(shè)計以及加載速度等方面都需要更高要求的情況下，以前的網(wǎng)頁制作語言HTML再也不能滿足人們的要求了。開始需要在移動、跨平臺等新特性下研發(fā)更新HTML語言。之前的HTML版本基本上是面對靜態(tài)文本網(wǎng)頁，被用作顯示文檔以及共享數(shù)據(jù)。而隨著動態(tài)網(wǎng)站以及應(yīng)用程序的誕生，網(wǎng)頁變得更加靈活，不過這也是有條件的——需要通過第三方插件或AdobeFlash來完成。多種的插件能夠讓網(wǎng)站變得更多彩，并且它們還能夠提供人機交互的功能。由于在線商店以及網(wǎng)頁游戲越來越受人們的歡迎，Web已經(jīng)不能再像從前一樣僅僅滿足于靜態(tài)文檔。如果要將這些功能添加到網(wǎng)頁當(dāng)中就必須通過第三方插件。不僅如此，甚至有時HTML仍然需用到其他的一些技術(shù)來使其支撐各種的媒體。這不僅增加了程序人員的壓力，還因為人們加載網(wǎng)頁的時候內(nèi)容太多，需要很長的時間，使得用戶體驗感很差。因此，通過不斷的努力，HTML5終于誕生了。HTML5對從前的網(wǎng)頁制作技術(shù)進行了非常多的改進甚至是創(chuàng)新。首先它添加了非常多的新元素并動態(tài)化了一些模塊，其次也是比較重要的一點是它添加了新的媒體元素，從而實現(xiàn)無需第三方的插件即可播放多媒體，讓開發(fā)人員更容易操作。新的Canvas元素不單單能夠使瀏覽器創(chuàng)建以及處理圖形，讓網(wǎng)頁當(dāng)中的布局更為得體，同時還為程序人員提供了便利，讓代碼變得更加精簡。HTML5不單單是互聯(lián)網(wǎng)的改革。由于其新增的跨平臺性以及其更加優(yōu)秀的兼容性，互聯(lián)網(wǎng)成為了更加完善的平臺。如今人們通過HTML5所開發(fā)的程序不單單能夠在計算機上運行，而且同樣能夠在移動產(chǎn)品上使用，從而使人們更容易、更快速地獲取到信息。不論是查看文檔的信息，亦或是加載的動畫以及視頻，它均能夠提高頁面的加載速度，讓用戶擁有更加好的體驗。HTML5一系列的新功能也讓開發(fā)人員對于網(wǎng)頁游戲的開發(fā)變得更加方便，他們再也不用通過第三方的插件支撐游戲的聲音效果以及動畫，網(wǎng)頁游戲因此正式步入到了新時代，無論是國內(nèi)還是國外的開發(fā)人員他們都紛紛開始投入到HTML5游戲的學(xué)習(xí)以及開發(fā)當(dāng)中。以前網(wǎng)頁游戲開發(fā)成本非常高的其中一個非常重要的原因便是服務(wù)器端它得憑借客戶端的支撐，如今HTML5已經(jīng)不僅僅能夠在Web端上操作，而且還能夠在移動端上進行操作了。這無疑讓開發(fā)人員的操作變得更加便利。同時，開發(fā)人員只需在原有的基礎(chǔ)上了解一下增加的新的HTML5以及JavaScript語言。當(dāng)然，各種各樣的引擎也是開發(fā)網(wǎng)頁游戲必不可少的。1.2課題研究的目的與意義按照現(xiàn)在游戲開發(fā)的這個趨勢，我認(rèn)為不久的將來便會成為HTML5的時代。人們在刷新HTML5游戲的時候就如同刷新頁面一樣方便。不僅如此，與HTML5所相關(guān)聯(lián)的技術(shù)均是開放給所有人的，這對于開發(fā)人員學(xué)習(xí)以及應(yīng)用來說非常的方便。它提供了更優(yōu)秀的動畫效果，這也十分迎合了進行游戲設(shè)計的開發(fā)者們。許多的游戲可以受到用戶的追捧除了別出一格的游戲玩法以外，還有就是能夠讓人印象深刻，漂亮的畫風(fēng)。這也是HTML5游戲比較特別的地方。不過，HTML5它是一種基于瀏覽器的語言，因此從中開發(fā)的游戲也只能是一些比較輕量級的小型游戲。隨著移動電子產(chǎn)品的多樣化，越來越多的人想要憑借游戲釋放工作以及學(xué)習(xí)帶給他們的壓力。盡管HTML5不可以制作大型的游戲，不過也因禍得?！谱鞯挠螒蚍N類千變?nèi)f化，豐富了人們的生活。游戲種類的多樣化也為游戲的開發(fā)商以及供應(yīng)商提供了非常多的機會。除此之外，HTML5它還提供了比較多的交互應(yīng)用功能。這一系列的交互應(yīng)用功能，無論是對于游戲還是對于網(wǎng)站來說，都是質(zhì)的飛躍。

第二章相關(guān)技術(shù)介紹2.1HTML5介紹HTML5，顧名思義它是HTML第五個版本。雖然主流的HTML4.01版本和之前的版本對比起來已經(jīng)完善了不少。不過由于各種各樣移動端應(yīng)用快速的發(fā)展，它已經(jīng)不能滿足開發(fā)人員們的要求。語言、語法、UI以及API等等方面都需要更新，為了滿足這一系列的要求，HTML5誕生了。早些時候開發(fā)人員更傾向于通過HTML制作靜態(tài)網(wǎng)頁，那個時候人們利用網(wǎng)絡(luò)的交互并不發(fā)達，也不是那么急切需要從網(wǎng)絡(luò)當(dāng)中了解外界的信息。不過近些年來，隨著技術(shù)以及經(jīng)濟的快速發(fā)展，人們更加傾向于從網(wǎng)上獲取信息。作為HTML新一代版本，當(dāng)然少不了一系列的新特性：（1）增添了能夠體現(xiàn)結(jié)構(gòu)語義化的標(biāo)簽，例如<header>、<footer>、<nav>等等。這一系列的標(biāo)簽使網(wǎng)頁結(jié)構(gòu)變得更緊湊以及合理，同時它們對開發(fā)頁面的整潔也同樣有很大的幫助；（2）表單相關(guān)內(nèi)容有所增加——表單元素、表單屬性以及input輸入類型。這對于開發(fā)人員制作表單相關(guān)內(nèi)容的時候來說更加方便了；（3）新增了視頻<video>以及音頻<audio>標(biāo)簽，這樣一來開發(fā)人員把視頻以及音頻標(biāo)簽引入后，網(wǎng)頁播放視頻以及音頻就不再需要像之前一樣借助第三方插件了；（4）Canvas以及SVG繪圖；（5）地理定位，通過getCurrentPosition()這一個方法從而得到用戶的位置；(6)增添了拖放API；（7）WebWorker。開發(fā)人員可以于當(dāng)前JavaScript的主線程當(dāng)中，通過Worker類加載一個JavaScript文件從而開始一個新線程，起到互不阻塞執(zhí)行的效果，而且提供主線程以及新線程間數(shù)據(jù)交換的接口：postMessage以及onmessage；（8）新增的本地存儲解決方案——WebStorage，不過它不是為了取代cookie而制定的標(biāo)準(zhǔn)，cookie作為HTTP協(xié)議的一部分用作處理客戶端與服務(wù)器的通信依然是必不可少的，session依賴于實現(xiàn)的客戶端狀態(tài)保持。WebStorage它用來解決那些原本不該使用cookie，卻不能不去使用cookie的本地存儲。2.2CSS介紹CSS即層疊樣式表，它是一種計算機語言，用來表示文件的樣式。它不但能夠靜態(tài)修改網(wǎng)頁，還能夠使用非常多的腳本語言來動態(tài)地格式化網(wǎng)頁中的元素。

開發(fā)人員主要通過CSS使頁面變得更加美觀以及一致，不僅如此，它還能夠?qū)?nèi)容以及格式分隔開來。在先前CSS并不存在的時候，開發(fā)人員如果需要修改HTML元素樣式的話則需要給所有的HTML元素逐個去定義樣式屬性。假如遇到HTML的內(nèi)容很多的時候，開發(fā)人員便需要定義非常多的重復(fù)樣式屬性，而且修改的時候還需要一一修改，花費很多功夫，因此CSS誕生了。CSS影響程序人員構(gòu)建Web站點，而且可能會一直持續(xù)下去。把網(wǎng)頁的表示信息從（X）HTML文件當(dāng)中移除出去，然后將它們統(tǒng)一保留在一個樣式表當(dāng)中。這具有非常多的優(yōu)點，例如降低了文件的大小、節(jié)省了網(wǎng)絡(luò)的帶寬以及讓開發(fā)人員更加容易維護等等。不僅僅如此，站點的表現(xiàn)信息以及核心內(nèi)容的分離，可以讓站點的開發(fā)人員在比較短的時間內(nèi)對網(wǎng)站進行大工程量的修改。CSS大大精簡了開發(fā)人員所編寫的網(wǎng)頁格式代碼，除此之外，外部樣式表還將被瀏覽器保存到緩存當(dāng)中，從而加快網(wǎng)頁內(nèi)容加載的速度，同時也縮減了需要上傳代碼的數(shù)量，這得益于重復(fù)設(shè)置的格式只能夠保存一次的特點。開發(fā)人員只需通過修改保存了網(wǎng)站格式的CSS樣式表文件便能夠調(diào)整站點的風(fēng)格以及特色。當(dāng)需要修改頁面數(shù)量非常多的站點時，這個用途便能夠大派用場了。開發(fā)人員不再需要像從前一樣一個個網(wǎng)頁的修改了，這大大減輕了開發(fā)人員的工作量，提高了他們的工作效率。2.3JavaScript介紹JavaScript是如今互聯(lián)網(wǎng)當(dāng)中最受歡迎的腳本語言，它可以用在HTML以及Web當(dāng)中，甚至能夠普遍地用在所有的電腦端以及移動端的設(shè)備當(dāng)中。它是具備函數(shù)優(yōu)先、輕量級、解釋型或即時編譯型的編程語言。盡管它是因為被用作開發(fā)Web頁面而聞名，不過其實它同時也被用作許多不是瀏覽器的環(huán)境當(dāng)中。與服務(wù)器端的腳本語言并不相同，JavaScript它主要是作為客戶端的腳本語言在用戶瀏覽器當(dāng)中運行，而且不需要服務(wù)器的支撐。因此，在早些時候許多的程序人員傾向于使用它來減輕服務(wù)器的負(fù)擔(dān)。不過，這同時也帶來另一個問題——安全性。隨著服務(wù)器的強大，盡管開發(fā)人員傾向于在服務(wù)端上運行腳本從而確保安全，然而JavaScript憑借它的跨平臺以及易于使用等一系列的優(yōu)點依然是十分受大眾的歡迎。同時，有一些特殊的功能還必須依賴于它才能夠在客戶端當(dāng)中進行支持。由于引擎和框架的快速發(fā)展，以及它們的事件驅(qū)動和異步IO等等一系列的特性，JavaScript也慢慢被用于編寫服務(wù)器端程序當(dāng)中。2.4游戲引擎技術(shù)介紹游戲引擎是一款游戲最為核心的東西，它就如同人的心臟，扮演著不可或缺的角色。開發(fā)人員可以使用它各種各樣的模板，這樣一來，他們就不需要從零開始了。現(xiàn)成的人物以及工具讓開發(fā)人員的開發(fā)變得更加輕松，同時也降低了那些想要入門游戲開發(fā)人們的門檻。游戲引擎它不是什么玄乎的東西，所有的游戲基本都需要這樣的代碼來起到控制的作用。經(jīng)過不斷的發(fā)展，現(xiàn)在的游戲引擎已經(jīng)發(fā)展成為了由若干個子系統(tǒng)一起構(gòu)成的復(fù)雜系統(tǒng)。而隨著游戲種類的不斷增加，游戲引擎也是多種多樣，一般分為二維引擎和三維引擎，各種各樣的引擎可以寫出風(fēng)格各異的游戲，這大大豐富了人們的精神世界。

第三章游戲引擎及功能分析3.1游戲引擎本次基于HTML5&JavaScript的射擊類游戲的實現(xiàn)我選擇了CreateJS作為游戲引擎。CreateJS是一款官方開放源代碼的HTML5游戲開發(fā)引擎，它大多數(shù)的應(yīng)用程序接口都是在Flash原始的應(yīng)用程序接口的基礎(chǔ)上進行模仿以及實現(xiàn)的。CreateJS提供了許多開發(fā)的套件和工具。不僅如此，它們還能夠直接將Flash動畫轉(zhuǎn)換為JS數(shù)據(jù)包，從而讓用戶更加容易去使用。特點：（1）Flash的用戶能夠非常容易地使用；（2）提供了能夠轉(zhuǎn)換一些Flash代碼并對其進行修改的工具；（3）類庫設(shè)計獨立，含有各種各樣模塊，開發(fā)人員能夠根據(jù)自己的需求去運用。游戲的實現(xiàn)少不了CreateJS當(dāng)中EaselJS以及TweenJS兩大開發(fā)工具的幫忙。EaselJS提供了完整的、分層的交互方法。有了它，開發(fā)人員能夠更加輕松地使用HTML5當(dāng)中的畫布功能。TweenJS則是契合小白的補間動畫庫，它支持?jǐn)?shù)字和對象的屬性以及CSS樣式屬性的賦值。它通過比較平滑的方式來修改元素的屬性值，開發(fā)人員只需要傳遞給TweenJS要修改的值、動畫結(jié)束時的最終值以及動畫總共花費時長等等信息，它便能夠計算從開始的動畫點到結(jié)束的動畫點之間的值，來產(chǎn)生平滑的動畫效果。3.2游戲功能分析3.2.1玩家操作規(guī)則功能分析點擊“游戲開始”以后，游戲畫面當(dāng)中將會開始隨機生成障礙物——球。玩家使用鼠標(biāo)操控飛機移動從而躲避障礙物，若飛機碰撞到障礙物即視為游戲結(jié)束，并輸出相應(yīng)的游戲結(jié)果——存活時長。游戲期間將會設(shè)置有計時器計算玩家操控飛機的存活時長。游戲期間，玩家按下回車（ENTER）鍵可以使游戲中途停止，計時器也會隨之暫停計算時間；按下空格（SPACE）鍵可以讓飛機發(fā)射子彈，從而彈開障礙物獲得更加持久的生存時長。3.2.2子彈功能分析點擊“游戲開始”以后，玩家按下空格（SPACE）鍵可以讓其操控的飛機從頭部發(fā)射出子彈。玩家能夠利用飛機射出來的子彈彈開障礙物，從而獲得更加持久的生存時長。3.2.3障礙物功能分析點擊“游戲開始”以后，游戲畫面當(dāng)中將會開始隨機生成障礙物——球。障礙物有三種碰撞事件：（1）碰到邊界，會反彈并且加速；（2）碰到玩家操控飛機射出的子彈將會被彈開；（3）碰到飛機則視為結(jié)束，并輸出游戲結(jié)果。3.2.4計時器功能分析點擊“游戲開始”以后，程序所設(shè)置的計時器開始計算時間，直到玩家操控的飛機碰撞到障礙物，使得游戲結(jié)束，計時器才會終止。如果玩家按下回車（ENTER）鍵暫停，則計時器也會同時暫停計算時間。通過計時器的計算時間，從而得出玩家最終的游戲結(jié)果——堅持的時長。

第四章游戲功能實現(xiàn)及展示4.1游戲功能實現(xiàn)4.1.1游戲背景實現(xiàn)個人認(rèn)為，界面的好壞將會直接影響到用戶的體驗。如今越來越多的人通過游戲來釋放壓力、放松身心，可以說是老少皆宜。我們不能只是像從前一樣只考慮到兒童同樣也需要考慮到其他年齡段的人們。所以，一個適合各年齡階段的美觀界面是必不可少的。對于首頁，我使用了HTML5最新的標(biāo)簽Canvas來渲染界面。同時，我還將使用HTML5的新標(biāo)簽<audio>來插入音樂，給用戶帶來更為刺激的游戲體驗。游戲需要定義背景圖片以及開始的狀態(tài)。首先獲取我所需要用到的圖片，其次把圖片所具有的屬性封裝為一個對象方便自己后面去調(diào)用。最后定義一個背景圖片的構(gòu)造函數(shù)，里面?zhèn)魅胛蚁惹熬鸵呀?jīng)定義好的對象，通過this將參數(shù)轉(zhuǎn)換成函數(shù)內(nèi)屬性。varstage1=newcreatejs.Stage("myCanvas1");varbgImage=newImage();bgImage.src="cat.jpg";varbgHeight=1024;//背景函數(shù)functionBackground(x，y，speed，img){this.x=x;this.y=y;this.speed=speed;this.img=img;

this.update=function(){

this.y+=this.speed;

if(this.y>bgHeight){

this.y=this.y-bgHeight;

}

}

this.draw=function(){

ctx.drawImage(this.img，this.x，this.y);

ctx.drawImage(this.img，this.x，this.y-bgHeight);

}}varbg=newBackground(0，0，2，bgImage);4.1.2玩家飛機功能實現(xiàn)接下來就是玩家飛機的繪制以及移動的實現(xiàn)了。首先繪制出玩家飛機的圖片，其次新建一個對象來封裝它的屬性，然后創(chuàng)建一個構(gòu)造函數(shù)，獲取先前對象的值。另外定義一些后面我將會用到的變量，例如判斷飛機是否碰撞到障礙物、定義飛機移動的坐標(biāo)等，而且用相同的方法來調(diào)用它們。因為設(shè)計的是使用鼠標(biāo)控制飛機的移動，所以將通過mousemove事件來獲取鼠標(biāo)坐標(biāo)并相應(yīng)改變飛機坐標(biāo)。//飛機繪制varplaneImage=newImage();planeImage.src="img/my1.png";//飛機函數(shù)functionPlane(x，y，img){this.x=xxx;this.y=yyy;this.img=img;this.draw=function(){ctx.drawImage(this.img，this.x，this.y);}}varplane=newPlane(280，520，planeImage);functionmouseMove(e){if(gameState==1){plane.x=e.pageX-32.5;plane.y=e.pageY-40;}}4.1.3玩家子彈類實現(xiàn)首先繪制出子彈的圖片，由于子彈是從飛機的頭部射出，因此我得調(diào)整坐標(biāo)定位。然后新建一個數(shù)組用于儲存每一個生成的子彈對象，循環(huán)遍歷所有生成的子彈使其全都擁有同樣且獨立的產(chǎn)生方法和運動形式。//子彈繪制varbulletImage=newImage();bulletImage.src="img/pd4.png";//子彈函數(shù)functionBullet(x，y，speed，img){this.x=x;this.y=y;this.speed=speed;this.img=img;this.update=function(){

this.y-=this.speed;

}

this.draw=function(){

if(this.y<0)return;

ctx.drawImage(this.img，this.x，this.y);

}}varbullet;varbullets=[];4.1.4障礙物功能實現(xiàn)創(chuàng)建障礙物——球的構(gòu)造函數(shù)，然后思考飛機碰撞的相關(guān)邏輯，通過球與邊界、子彈以及飛機相碰時它們坐標(biāo)的聯(lián)系然后換算出來。和子彈一樣，每一個障礙物都是一個獨立的對象。障礙物生成的時候得注意障礙物的位置是canvas界面內(nèi)隨機生成的，這里使用隨機數(shù)的方法來實現(xiàn)。最后將所有對象的碰撞事件融合在一起，使這些零散的事件有一個清晰的邏輯。//球函數(shù)functionBall(){this.x=rand(20);this.y=rand(20);this.r=rand(25)+15;this.speedX=rand(5);this.speedY=rand(5);this.color="rgb("+rand(95)+"，"+rand(155)+"，"+rand(255)+")";//移動函數(shù)this.moving=function(){this.x+=this.speedX;this.y+=this.speedY;

if(this.x>myCanvas1.width-this.r){this.speedX=-this.speedX-rand(2);}if(this.x<this.r){this.speedX=Math.abs(this.speedX)+rand(2);}if(this.y>myCanvas1.height-this.r){this.speedY=-this.speedY-rand(2);}if(this.y<this.r){this.speedY=Math.abs(this.speedY)+rand(2);}for(variinbullets){if(bullets[i].x<=this.x+this.r/2&&bullets[i].y<=this.y+this.r/2&&bullets[i].x+25>=this.x-this.r/2&&bullets[i].y+66>=this.y-this.r/2){if(this.x<bullets[i].x){

this.speedX=-Math.abs(this.speedX);

}

if(this.x>bullets[i].x){

this.speedX=Math.abs(this.speedX);

}

this.speedY=-Math.abs(this.speedY);

}}//游戲結(jié)束判定if(plane.x<=this.x+5&&plane.y<=this.y+5&&plane.x+45>=this.x-5&&plane.y+55>=this.y-5){alert("被小球撞毀，共堅持了:"+count+"秒");window.location.reload();//刷新父窗口中的網(wǎng)頁}

ctx.beginPath();

ctx.arc(this.x,this.y,this.r,0,2*Math.PI);

ctx.fillStyle=this.color;

ctx.fill();}}varball=newBall();varball=[];for(vari=0;i<100;i++){ball[i]=newBall();}//球?qū)崿F(xiàn)functiondraw1(){for(vari=0;i<8;i++){ball[i].moving();}

}4.1.5計時器功能實現(xiàn)定義一個計時器，使它起始的時間為0，然后創(chuàng)建一個運行函數(shù)，讓計時器啟動。//定義計時器varcount=0;//計時器函數(shù)functionrun(){ if(gameState==1){ count++; text.text1="別讓小球碰到你!"; text.text="已經(jīng)堅持:"+count+"秒!"; stage.update(); }}4.1.6游戲結(jié)果判定通過判定障礙物是否碰撞到我方飛機從而輸出本次的游戲結(jié)果。//游戲結(jié)束判定if(plane.x<=this.x+5&&plane.y<=this.y+5&&plane.x+45>=this.x-5&&plane.y+55>=this.y-5){alert("被小球撞毀，共堅持了:"+count+"秒");}4.2游戲功能展示打開頁面，首先將會呈現(xiàn)游戲開始的界面，并且我們設(shè)置的音頻也會同時播放。點擊“開始游戲”，將會轉(zhuǎn)換到游戲場景，游戲也就隨之開始。圖4-1游戲開始界面圖轉(zhuǎn)換到游戲場景后，定時器也隨之開啟，并且將會隨機生成障礙物——球。玩家將使用鼠標(biāo)控制飛機的移動。按下空格鍵可以發(fā)射子彈從而彈開障礙物，按下回車鍵可以暫停游戲，且定時器也會隨之暫停。游戲過程當(dāng)中，障礙物若碰到邊界會加速反彈。圖4-2游戲進行界面圖當(dāng)玩家操控的飛機碰撞到障礙物，則視為游戲結(jié)束，計時器也同時終止計時。此時將會彈出對話框，顯示玩家本次的游戲成績——生存時長。圖4-3游戲結(jié)束判定圖

第五章游戲?qū)嶋H測試效果游戲的測試主要為UI界面的功能測試以及游戲過程當(dāng)中涉及到的功能測試。UI界面的功能測試包括所有按鈕功能的實現(xiàn)和場景的轉(zhuǎn)換。游戲過程當(dāng)中涉及到的功能的測試包括玩家對于飛機的操控功能以及障礙物的相關(guān)碰撞事件的實現(xiàn)。5.1UI界面功能測試測試編號測試項操作步驟預(yù)期結(jié)果實際結(jié)果UI001開始游戲按鈕點擊按鈕1、成功轉(zhuǎn)換場景2、轉(zhuǎn)換場景失敗成功轉(zhuǎn)換場景UI002游戲場景中的空格鍵按下空格鍵能夠正常發(fā)射子彈不能夠正常發(fā)射子彈正常發(fā)射子彈UI003游戲場景中的回車鍵按下回車鍵能夠正常暫停游戲2、不能正常暫停游戲正常暫停游戲表5-1UI界面功能測試表我首先測試了游戲開始界面“開始游戲”按鈕，發(fā)現(xiàn)點擊“開始游戲”按鈕后能夠成功轉(zhuǎn)換場景。其次是測試游戲場景當(dāng)中的空格鍵，發(fā)現(xiàn)按下空格鍵后，操控的飛機能夠正常的發(fā)射出子彈。最好是測試游戲場景當(dāng)中的回車鍵，發(fā)現(xiàn)按下回車鍵后，游戲暫停，計時器也隨之停止。5.2游戲內(nèi)功能測試測試編號測試項步驟預(yù)期結(jié)果實際結(jié)果Test001障礙物等待正常生成正常生成Test002障礙物碰撞邊界觀察加速反彈加速反彈Test003飛機移動實際測試正常移動正常移動Test004飛機射擊實際測試障礙物彈開障礙物彈開Test005障礙物碰撞飛機實際測試游戲結(jié)束游戲結(jié)束表5-2游戲內(nèi)功能測試表我首先測試游戲進行中障礙物的生成，經(jīng)過短暫的等待發(fā)現(xiàn)障礙物正常生成。接下來是障礙物的兩個碰撞事件——碰撞邊界以及碰撞飛機。經(jīng)過觀察發(fā)現(xiàn)障礙物碰撞邊界以后可以加速反彈，碰撞飛機則為游戲結(jié)束，彈出對話框并停止計時，均無不良情況發(fā)生。最后是飛機的移動以及射擊事件，經(jīng)過鼠標(biāo)的移動和按下空格鍵的操作發(fā)現(xiàn)飛機能夠正常移動且發(fā)射子彈后障礙物能夠正常彈開。結(jié)論雖然之前上課有學(xué)到過相關(guān)的知識，但是需要自己獨立開發(fā)還是比較困難。不過畢竟想要畢業(yè)，我就得要好好去鉆研并實現(xiàn)這個項目。人不逼自己一把，都不知道自己有多大能耐。在觀看了大量的電子書以及視頻之后，我逐漸學(xué)到了許多，不過只是領(lǐng)會還是遠(yuǎn)遠(yuǎn)不夠的。當(dāng)我親自著手去完成這個項目時，便暴露出了各種各樣的問題。不過我并沒有輕易地放棄，而是不斷地上網(wǎng)查找相關(guān)問題以及向師兄請教。功夫不負(fù)有心人，我最終還是順利地完成了這次的項目。盡管這個游戲還有很多需要改進的地方，不過我覺得有了這次的經(jīng)驗，如果日后碰到相類似項目的時候我會更加得心應(yīng)手，可以把項目做得更加完美?？偟脕碚f，這次的畢業(yè)設(shè)計真的是讓我學(xué)到了非常多的東西。不單單是學(xué)到了許多的技術(shù)，它還讓我加深了對HTML5以及JavaScript的理解。增強了我自己的動手能力，獲得了許多的經(jīng)驗和教訓(xùn)。這是一個短暫而又格外充實的畢業(yè)設(shè)計，我認(rèn)為這將在邁向社會的過程中扮演過渡的角色，這是我一生當(dāng)中十分重要的一次的經(jīng)歷。我相信有了這一次的經(jīng)歷，畢業(yè)以后我能夠更快地融入到社會當(dāng)中，在自己的領(lǐng)域上創(chuàng)造更多、更大的價值！

參考文獻[1]曹同雷.一款基于HTML5技術(shù)的游戲引擎的設(shè)計[J].科技展望.2017(15)[2]王睿.淺談HTML5的技術(shù)優(yōu)勢[J].遼寧師專學(xué)報(自然科學(xué)版).2017(01)[3]梁卓韜.淺談HTML5在網(wǎng)頁游戲中的運用[J].電子制作.2016(08)[4]鄭逸凡.基于HTML5技術(shù)的Web游戲設(shè)計[J].計算機光盤軟件與應(yīng)用.2014(17)[5]黎志雄，黃彥湘，陳學(xué)中.基于HTML5游戲開發(fā)的研究與實現(xiàn)[J].東莞理工學(xué)院學(xué)報.2014(05)[6]鄭逸凡.基于HTML5Canvas的射擊類游戲射擊[J].林區(qū)教學(xué).2014(12)[7]彭小紅，林界.基于HTML5&JavaScript的游戲設(shè)計和實現(xiàn)[J].現(xiàn)代計算機(專業(yè)版).2016(25)[8]徐佳賓.基于HTML5與Node.Js的游戲引擎的設(shè)計與開發(fā)[D].南京郵電大學(xué)[9]王青.基于HTML5_Canvas的三維粒子圖形動畫的設(shè)計[J].中國科技信息.2019(05)[10]CFANFANS.讓時間停止保留網(wǎng)頁游戲進度[J].電腦愛好者.2015(04)[11]陽曉霞，譚衛(wèi).基于HTML5技術(shù)的游戲開發(fā)與實現(xiàn)[J].信息與電腦(理論版).2019(09)[12]曹學(xué)琪，尼瑪扎西.基于HTML5的Flappybird游戲設(shè)計與開發(fā)[J].數(shù)字技術(shù)與應(yīng)用.2019(09)[13]郭秋緲.節(jié)奏類游戲人機交互設(shè)計與應(yīng)用[D].北京工業(yè)大學(xué).2012(18)[14]謝賓.小型二維游戲引擎設(shè)計和實現(xiàn)[D].電子科技大學(xué).2013(30)[15]王旭生.一個簡單的飛機對戰(zhàn)游戲引擎設(shè)計[D].吉林大學(xué).2012(15)

致謝到這里，這篇論文已準(zhǔn)備完成了，我的大學(xué)生活也將圓滿結(jié)束。四年前，我懷著對求學(xué)求知的無窮向往，踏入了我夢寐以求的大學(xué)校園?；貞涍@四年大學(xué)生活，每天都在學(xué)習(xí)以及探索新的知識，掌握新的技能，期間十分榮幸遇到了很多良師益友。他們對我的學(xué)習(xí)供給了很多的幫忙，使我每天過得很充實。在此，衷心的表示感謝。衷心感謝我的導(dǎo)師李梁奇老師。撰寫畢業(yè)論文期間，老師悉心的指點給了我很多的思路。在我遇到問題和難題時，老師的及時糾正，耐心的指引和激勵使我有充足的決心信念和鍥而不舍的態(tài)度戰(zhàn)勝重重難關(guān)。在此，向劉老師示意由衷的敬意和感謝。感激學(xué)校給我供給了這么優(yōu)越的學(xué)習(xí)環(huán)境，感激數(shù)字媒體技術(shù)對我的悉心栽培。感激輔導(dǎo)員老師對我生活和學(xué)習(xí)上的無私幫忙。感激學(xué)院各位老師對我的循循善誘。同時感激與我共同學(xué)習(xí)、共同發(fā)展的同班伙伴們。感激已畢業(yè)了的師兄師姐，與你們的溝通交流，我受到了很大的幫忙和啟迪。感激父母和家人，是你們一向任勞任怨，無私奉獻。鼓勵我，支持我，使我進步，使我成長。感激你們，你們永遠(yuǎn)是我追夢道路上最堅固的后盾和不斷的動力！

HYPERLINK如何選擇組裝電腦配件

如何選擇組裝的電腦配件．

第一，選擇好CPU平臺，就是INTER還是AMD，看你是要配什么樣的電腦，高端還是低端的，兩個平臺都高低的產(chǎn)品。第二，選擇主板了，主板的品牌比較多，質(zhì)量，價格也不一，當(dāng)你第一步卻定了，那么主板也就相應(yīng)的卻定下來了，以INTER為例，只可以選擇775接口的主板（早期有478接口的，不推薦），主板的選擇主要有兩種，一是集成顯卡，二是不集成顯卡。集成顯卡的話，就可以省下顯卡的錢，但是對游戲玩家不推薦。那么當(dāng)然是選擇不集成顯卡的主板了，而且最好選擇一線品牌，如華碩，技嘉等。主板里，還有個蕊片組的選擇。關(guān)于蕊片組，各個品牌的主板命名有些不一樣，主流是INTER965，945，915，VIA的KT890，還有NFORCE4，NFORCE5。等。比較難說清楚。最好是選擇INTER的蕊片組，雖然價格會稍高一些。推薦945，技術(shù)比較成熟。第三，顯卡的選擇。顯卡主要還是有兩類品牌，GEFORCE和ATI，兩個品牌有高，中，低的顯卡。顯卡選擇要看你個人喜歡了，預(yù)算充足的話，最好是買中，高端的顯卡。

第四，就是內(nèi)存了，內(nèi)存關(guān)系電腦的穩(wěn)定性。當(dāng)然是要好一點的。買一線品牌的?，F(xiàn)在配電腦，主流是DDR667，DDR800DDR1333第五，顯示器的選擇，推薦液晶。如何選擇硬件組裝電腦這是一個老生常談的問題了，這也是一個讓高手們顯示自己硬件功底的問題，同時這還是一個讓很多新手為之焦頭爛額的問題。該怎么配？具體配什么？怎樣配才能盡量減小瓶頸？本文就將從內(nèi)到外，從理論到實踐，為朋友們抽絲剝繭一一道來。

一、CPU

作為一臺電腦最關(guān)鍵的組成部分，CPU確實起著舉足輕重的作用，但體現(xiàn)一臺電腦的綜合速度，并不是僅僅依靠CPU的，常?？吹胶芏嘈率謧冊谂潆娔X的時候，把CPU選的很好，但其他的東西諸如內(nèi)存、主板、硬盤等都選的不太理想，好像這臺電腦速度的快慢就體現(xiàn)在CPU速度的快慢上似的。甚至很多著名的品牌機廠商，都推出過類似“P4+256M內(nèi)存”的這種跛腳配置。其實對于一般的家用電腦而言，一個真正會配的高手，是不會把大量的錢花在CPU上的。家用電腦，畢竟不是做密集型科學(xué)計算用的，它講求的是多種媒體的配合工作，講求的是能一邊下載文件、一邊上網(wǎng)瀏覽網(wǎng)頁、一邊聽音樂、一邊還能打開其他的程序，在這種情況下，提升內(nèi)存的容量比提升CPU的主頻對速度的影響要明顯的多?，F(xiàn)今的中國家庭用戶，很多家長對于電腦一竅不通，他們只聽說“奔四”代表著速度快，并不知道整機速度的快慢除了CPU以外，還有很多其他的因素影響著它。但在買電腦的時候，最后做決定并掏錢的人，往往都是這些啥都不懂的家長們，于是就出現(xiàn)了上面的一幕：品牌機廠商為了能有更好的銷路、兼容機裝機店的銷售人員為了能拿到更多的獎金，開始違背良心來配置出這種高主頻處理器、低容量內(nèi)存的跛腳電腦。說嚴(yán)重點，這是屬于對消費者的不負(fù)責(zé)任，是一種商業(yè)欺詐行為！同樣5000元的配置，高手配出來的賽揚，比新手配出來的P4還要快很多，曾經(jīng)有一家全球著名的硬件網(wǎng)站在2003年的時候刊登過一篇關(guān)于配置家用電腦時各硬件占用總預(yù)算百分比的文章，文中很明確的提到了CPU的價錢最好不要超過總預(yù)算的10％－15％，我們雖然不能說他肯定完全正確，但至少人家是通過很多調(diào)查后得出的結(jié)論，有借鑒的理由。反觀現(xiàn)在的很多所謂的“低價奔四電腦”、“3999元買P4品牌機”之類的廣告，我想說的就是：你花了3999元，只買了一塊P4的處理器，其他的什么都沒有了！

二、內(nèi)存

對于配置一臺電腦來說，內(nèi)存是重頭戲，容量、速度、類型等等每一項指標(biāo)都對最終的整機綜合速度起著至關(guān)重要的影響，尤其是內(nèi)存的帶寬和容量。對于內(nèi)存帶寬而言，很多人都認(rèn)為400MHz、533MHz前端總線的賽揚四或P4，配單通道的DDR內(nèi)存就足夠了，雙通道DDR內(nèi)存是配合800MHz以上前端總線的P4處理器用的，其實這樣就大錯特錯了，哪怕是最老的賽揚四，都需要雙通道的DDR內(nèi)存才能達到它的帶寬！也就是說，你如果選擇賽揚四1.8G，必須配合865以上的主板和至少雙通道DDR200的內(nèi)存，才能滿足它的帶寬要求！稍微計算一下就可以得知：賽揚四1.8G的前端總線是400MHz，它的內(nèi)存帶寬理論值是400MHz×64bit÷8＝3.2G/s，但當(dāng)它裝在845系列的主板上時，由于845主板的限制，即使你插上能符合它帶寬要求的DDR400內(nèi)存，也只能運行在DDR266上，這時的內(nèi)存所能提供的帶寬是266MHz×64bit÷8＝2.1G/s，比3.2G/s要小很多，即使你通過BIOS里的內(nèi)存調(diào)節(jié)選項往上調(diào)節(jié)一檔（也只能調(diào)節(jié)一檔而已），讓內(nèi)存運行在DDR333下，所能提供的帶寬也僅僅是333MHz×64bit÷8＝2.66G/s，離3.2G/s還是有一定的距離，而內(nèi)存帶寬的降低，能非常明顯的降低整機的綜合速度，運行任何程序都能明顯的感覺出來！所以如果想滿足賽揚1.8G處理器的內(nèi)存帶寬要求，你必須要為它配置865以上的主板和雙通道的內(nèi)存才行！P4亦是如此。很多人也許會問：那845系列的主板是配什么處理器的呢？我想回答你的就是：845系列的主板是屬于“不能用”的主板，因為處理器永遠(yuǎn)比主板發(fā)展的快，當(dāng)初Intel造出845系列的芯片組是為了能給當(dāng)時的賽揚和P4提供一個過渡的平臺，不至于讓它們成為“沒有主板配合”的處理器而已，也是為了能在低端市場分一杯羹，而現(xiàn)今865甚至9xx系列的主板橫行的時候，845系列的主板確實是屬于“不能用”的主板了，滿足不了任何一款處理器的內(nèi)存帶寬，造成性能上的嚴(yán)重低下，試問這種主板你會選擇么？即使配臺2000多元的超低價電腦，也不要去選擇845系列的主板，至少需要865以上的和雙通道內(nèi)存才行，因為內(nèi)存帶寬是一個非常影響系統(tǒng)性能的參數(shù)，倘若一味的為了省錢而配置845系列的主板，那就得不償失了。

內(nèi)存的容量方面，應(yīng)每個人對電腦的使用方向不同，容量的要求也是不同的，現(xiàn)在配置的家用電腦，筆者建議：如果不打游戲，或者是打打掃雷、紙牌之類的游戲，平時注重于上網(wǎng)瀏覽或者是聊天、看電影之類的應(yīng)用的話，內(nèi)存容量不應(yīng)該低于1G；如果是偶爾打打單機游戲或者是網(wǎng)絡(luò)游戲，內(nèi)存容量應(yīng)該選擇在2G左右，如果是經(jīng)常打大型的游戲或是進行HDTV視頻編輯等應(yīng)用，那么4G的內(nèi)存是必不可少的。

三、主板

一臺電腦的穩(wěn)定性和兼容性，一大部分是看主板的，一款優(yōu)秀的主板不僅需要擁有上等的用料和優(yōu)良的做工，還需要擁有合理的走線設(shè)計，那些沒有技術(shù)實力的三、四線主板廠家生產(chǎn)的主板，多數(shù)是采用公版走線，而且用料非常差，穩(wěn)定性不堪一擊，這種類型的主板，筆者建議寧愿不買電腦也不要配這種主板，否則以后將會是個淘氣的祖宗。對于家庭用戶，主板方面一定不能省錢，預(yù)算夠的話最好能買個一線的主板品牌，如果預(yù)算實在不足，二線的主板是底線了，不要再往下選擇了，畢竟家用電腦是用來使用的，不是用來整天維修的。再談到主板的用料，筆者常常看到很多新手在配置主板的時候，貌似老鳥似的說某某品牌的主板好，某某品牌的不好，試問你知道它好在哪里么？不好在哪里么？這個就要看主板的用料了，雖然用料好的主板并不能代表一定是高檔主板，但最少能代表它的電氣性能出色。舉一個很簡單的例子吧：有A、B兩款主板，A主板的處理器供電濾波電容采用的是日系電容，B主板的處理器供電濾波電容采用的是臺系電容，那么基本上可以肯定的是：如果在電源輸出電壓的波動范圍比較大的情況下，A主板就比較能耐得住，而B主板就很容易產(chǎn)生電容鼓包、漏夜等情況。不要小看這小小的電容，筆者從一個開維修店的朋友那里得知，來維修主板的人，有80％的都是這幾個小電容損壞，究其原因，就是電源選擇的不好，導(dǎo)致了輸出電壓的不穩(wěn)定，久而久之最終導(dǎo)致這幾個小電容爆漿，并且詳細(xì)敘述了主板的品牌：“一線廠家的×碩牌主板就很少出現(xiàn)這種情況，但同樣為一線廠家的×星牌主板，經(jīng)常遇到！原因就是前者的大部分主板使用的是日系電容，而后者的大部分主板為了省錢，選用的是臺系電容！”廠家的廣告不能信，宣傳也不能信，看到一個產(chǎn)品的廣告之后，你所能相信的唯一一點就是：地球上有這么個產(chǎn)品的存在！然后其他的就統(tǒng)統(tǒng)都不能信了！網(wǎng)上有好多所謂的“評測”文章，都是槍手寫的，基本上沒有任何參考余地，只能作為一篇小說來讀，一款主板的真正性能，只有你自己使用了之后才能知道。廠家為了銷量、商家為了利潤，他們能把最最垃圾的主板宣傳為最頂級的產(chǎn)品，筆者曾經(jīng)就看到過一款四線品牌的主板廠商，在對其主流主板的廣告上說“最優(yōu)秀的設(shè)計、最精湛的工藝、最穩(wěn)定的性能”……結(jié)果一看報價：550元/塊……其他的話我也不想多說了，只想問問這家廠商：你這么垃圾的主板都用了三個“最”字，那么華碩的同芯片組主板，售價是你三倍的，應(yīng)該用什么詞語來描述了？？中國有一句古話：一分錢一分貨，說的非常正確！不要認(rèn)為價格高的主板就是暴利產(chǎn)品，從市場經(jīng)濟學(xué)上說，暴利產(chǎn)品是不會被市場所接受的，之所以他能存活到今天，而且售價依然是這么高，肯定有他的理由，他在做工用料方面肯定比其他品牌的要好很多，成本高所以售價高，在此，筆者奉勸大家一句：買主板千萬不要憑僥幸心理，認(rèn)為自己能花很少的錢買到很好的東西，只有錯買的沒有錯賣的，商家永遠(yuǎn)都比你精明！主板上面還是老老實實的多花點錢來買個一線產(chǎn)品吧，否則以后有你吃苦的時候！

四、硬盤

現(xiàn)在的電腦，硬盤的速度當(dāng)之無愧的成為了“第一大瓶頸”，無論你是再高的高手，配電腦的時候也無法消除這個瓶頸的存在，我們只有盡量的減小…再減小……。對于家用電腦的硬盤來說，容量和速度是兩個非常重要的參數(shù)，容量上而言，筆者建議：如果你的電腦只是上網(wǎng)瀏覽瀏覽、偶爾打打小游戲的，那么160G的硬盤是個不錯的選擇；如果你常常下載軟件或電影，那么250G的硬盤是個不錯的選擇，如果你是個下載狂人，那么400G的硬盤比較適合你；如果你有DV或者是經(jīng)常編輯大型的視頻文件，那么400G×2比較適合你，如果你是個玩HDTV的人，那么恭喜你，400G×4也許你都不夠用。對于硬盤容量上的選擇，你不能考慮現(xiàn)在是否夠用，你應(yīng)該考慮未來的1年里是否夠用，大概的公式是：現(xiàn)在需要的容量×3。也就是說，如果你現(xiàn)在感覺80G的硬盤差不多夠用了，那么你就需要買個250G的硬盤。如果你現(xiàn)在感覺120G的硬盤夠用了，那么就去買個400G的硬盤吧。硬盤另外的一個參數(shù)就是速度，受到內(nèi)部傳輸率等諸多因素的限制，一塊硬盤的實際傳輸速度是不可能達到它的接口速度的，現(xiàn)在的并口硬盤基本上都是ATA133了，串口硬盤也都是150了，但民用級硬盤的實際傳輸速度最快的也還沒突破66M/s，所以跟內(nèi)存相比，硬盤的速度是電腦中最大的瓶頸，那么怎么來減小這個瓶頸呢？于是人們就發(fā)明了RAID，就是磁盤陣列（當(dāng)然RAID不是僅僅為了這個而發(fā)明的），用兩塊一模一樣的硬盤來組成RAID0，速度理論上能提高1倍，雖然實際上是不可能達到1倍的，但至少能非常非常明顯的感覺到了硬盤速度的提升，筆者建議：如果你買的主板是帶有RAID功能的，并且你需要保存的數(shù)據(jù)不是很重要的話，那么強烈建議你在預(yù)算允許的情況下購買兩塊硬盤來組建RAID0，這將使你能親身體會到飛機與火車的速度差別！但最好是串口的，如果是并口的話，因為并口走的是PCI總線，由于PCI總線上的設(shè)備比較多，所以速度不可能達到比較高的地步，但如果是串口的話，那么硬盤的速度提升將更加明顯！

五、顯示器

顯示器方面，筆者想澄清一個觀念：曾經(jīng)聽過非常多的人說液晶顯示器保護眼睛，因為沒有輻射和閃爍……包括很多業(yè)內(nèi)人士都這么認(rèn)為的，其實錯了，液晶顯示器比普通的CRT還要傷眼睛！因為傷眼睛不僅僅是輻射和閃爍，還有對比度、亮度等參數(shù)，雖然液晶顯示器的輻射和閃爍比CRT要小的多，但它那要命的對比度、那要命的色澤度、還有那大于每平方米300cd的亮度，這些都會對眼睛造成很大的傷害，并且你即使將液晶顯示器的亮度和對比度調(diào)節(jié)到最低，也還是非常的刺眼。德國的一家權(quán)威機構(gòu)做過一項調(diào)查：液晶顯示器用久了會使人的眼睛感覺到疲倦，甚至頭痛等癥狀，而使用相同時間的CRT顯示器，卻基本沒有這些情況出現(xiàn)。現(xiàn)在的通過TCO03認(rèn)證的CRT顯示器，其實外露的輻射已經(jīng)相當(dāng)小了，基本上對人已經(jīng)沒有多大的傷害了，閃爍感也可以通過調(diào)節(jié)刷新率來降低，筆者實在是搞不懂為什么很多人非要去選擇液晶顯示器，還非要說液晶顯示器不傷眼睛？？一個最差的17寸液晶顯示器的價格，能買一臺不錯的、通過TCO03標(biāo)準(zhǔn)的19寸CRT了，顯示面積也差不多大，而且CRT又比液晶更保護眼睛，液晶顯示器唯一的一個優(yōu)點就是占用空間小而已，其他的統(tǒng)統(tǒng)是缺點，為什么不選擇CRT呢？？說到TCO03標(biāo)準(zhǔn)，現(xiàn)在很多的號稱是通過TCO03認(rèn)證的顯示器，其實都是貼牌的，都沒有真正的通過，關(guān)于怎樣鑒別一臺TCO03的顯示器，網(wǎng)上已經(jīng)有很多文章可以搜索到，筆者在此不想過多敘述，只是提醒大家一點：一臺真正的通過TCO03認(rèn)證的顯示器，外表的顏色除了白色以外，是不會有其他顏色的了，因為TCO03認(rèn)證中有重要的一條就是外殼可回收性，而除了白色以外，其他的任何顏色都加了有機染料在里面，是不能作為回收利用的，這點請大家購買顯示器的時候一定要注意了！

六、電源

作為一臺電腦的動力之源，電源質(zhì)量的好壞直接關(guān)系到這臺電腦的壽命，在這點上筆者先要肯定一下品牌機廠商的做法了，在各大品牌機中，雖然其他配件可以用跛腳來形容，但所配的電源和機箱基本上都是不錯的，功率雖然不是很大，但滿足它的配置是足夠了。而一些新手在配兼容機的時候，很多情況下都忽視了電源這一方面，結(jié)果導(dǎo)致的直接后果就是主板電容爆漿、硬盤損壞、顯卡電容爆漿等情況。對于電源來說，有很多參數(shù)去標(biāo)準(zhǔn)它，但對我們影響最大的兩個參數(shù)就是它的功率和輸出電流穩(wěn)定度，首先來看看它的功率：很多國內(nèi)的著名電源制造廠商，例如×河田、×國者等等品牌，都有嚴(yán)重虛標(biāo)功率的行為，他們所標(biāo)稱的功率，基本上就是這款電源的峰值功率，并不是額定功率，電源的功率一共分三種：額定功率、最大功率和峰值功率，額定功率是指電源能夠在此負(fù)載下長時間穩(wěn)定工作；最大功率是指電源能夠在此負(fù)載下短時間工作，時間一長就容易出現(xiàn)問題；峰值功率是指電源的瞬間可承受負(fù)載，如果時間稍微一長，馬上就冒煙。也就是說，最大功率和峰值功率對我們來說根本沒有任何意義，我們所需要了解的就是額定功率，但