iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 25
0
Modern Web

關於你關於我關於phaser系列 第 25

Day 25 連線五子棋 ~ 關於遇到的問題與可以優化的地方

  • 分享至 

  • xImage
  •  

在製作這個連線五子棋,我遇到的了三個問題,這邊一一跟大家講問題的內容與後來解決的方式

  1. 當玩家下到最邊界時會噴錯並終止遊戲

這是在一開始訂製規則的時候,當規則都訂好了,下在中間都可以判斷獲勝,並且 console 都有說誰贏誰輸,但不管什麼時候,如果下在最邊界的地方(x = 0 或 19,y = 0 或 19),就會報錯,並且錯誤訊息寫: Cannot read prototype '0' of undefined

一開始我認爲是規則沒寫好,所以又重新看了一次,發現沒問題後,開始好好認真看一下這一個錯誤訊息,並且問了一下人,最後找到最正確的答案

大家都知道,在 JS 裡面,如果會宣告一個變數但是沒有賦予值,當呼叫這個變數就會得到 undefined 這個值,而這個問題在於,當我在判斷勝利時,並沒有去規範判斷到哪邊就可以

以往左爲例,當我判斷完 0,10 後,下一個會判斷的是 -1,10,而在陣列裡面,先找列,因爲沒有 -1 這一列,所以他會先回報 undefined ,所以我們實際在找 undefined,10 ,當然 undefined 並沒有行得特性,就會說 undefined 底下沒有 '0' 這個東西,知道這個問題後,我就在每次判斷勝利前,先判斷是否已經超出邊界範圍,還沒就判斷勝利,超過就可以 break (因爲也沒這個值)

  1. 當下完一局時,重新整理不能重新開始新的一局

這一個問題主要是出在 socket 連線的時候,當玩家下完後,沒有重新讓 client 連線,變成他們的局已經結束但他們還是在連線中,所以配對機制不會重新觸發一次,當然沒辦法重新一局,所以我在雙方有勝負時,停止渲染並且發出斷線的請求,當雙方要在玩時,就會重新連線,藉此觸發配對機制

  1. 當只有在白子贏的時候,重新整理不能開始新的一局

由於預設每一局的開始都是黑子先,但是 server 是一直開著的,他的狀態是會延續上一局的結束,所以變成如果白子結束,我一開始是下停止渲染且沒有將狀態初始化回來,所以下一句變成現在狀態是白子,但我有講到,一開始每一局都要是黑子先下,就變成雙方都是白子沒人可以下,所以我在每一次的結束(包含 client 獲勝與斷線),都會重新初始化,就解決這個問題了

以上就是我在實作遇到比較印象深刻的問題,當然這一個連線五子棋還是有許多可以優化的地方,包含流程的規劃、可以知道對方最後下的位置、音效、聊天.....等等,這些都是可以增加使用者體驗的,但是我也在這個專案裡面學到了互動與連線的方式,而鐵人也快尾聲了,就期待我明天的主題吧~~


上一篇
Day 24 連線五子棋 ~ 關於實作
下一篇
Day 26 跳出來講個的歷史好啦
系列文
關於你關於我關於phaser30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言