井字棋難度在於判斷勝利條件,說起來容易三子連一線,就算獲勝,但是實施起來很困難。
我這裡使用了乙個較為取巧的辦法:我將所有可能獲勝的方式歸總起來,存在乙個陣列裡,再把下棋雙方所下的每一步棋子都放置在乙個陣列中,然後對元素大於3的存棋陣列進行子陣列遍歷,取出其中長度為3的子陣列與獲勝陣列進行比較,若子陣列在獲勝陣列裡有出現,則判斷勝利。
效果圖
**
"button"
>
class
="drag-test"
>
class
="drag"
>
"drag-ele"
draggable
="true"
@dragstart
="whendragstart($event)"
>
別拽我span
>
div>
class
="box"
@drop.prevent
="eledrop($event)"
@dragover
="dragoverprevent($event)"
>
}div
>
div>
class
="checkerboard"
>
class
="piece"
v-for
="(item,index) in list"
:key
="index"
@click
="clickplay(item)"
>
>
}span
>
div>
div>
class
="footer"
>
>
@click
="gotouplv"
>
returnspan
>
div>
>
@click
="gotonextlv"
>
gospan
>
div>
footer
>
div>
import utils from
'../../utils/index.js'
export
default,,
,,,,
,,],
counts:1,
winner:[[
0,1,
2],[
3,4,
5],[
6,7,
8],[
0,3,
6],[
1,4,
7],[
2,5,
8],[
0,4,
8],[
2,4,
6]],
xresult:
, oresult:
, wintof:
false}}
,mounted()
, methods:
,eledrop
(e),
dragoverprevent
(e),
gotouplv()
,gotonextlv()
);},
clickplay
(ele)})
this
.winneresult
('x');
}this
.counts++;}
elseif(
this
.counts %2==
0&&this
.list[ele.id -1]
.content =='')
})this
.winneresult
('o');
}this
.counts++;}
}},winneresult
(query)
,100
)this
.wintof =
true}}
)}else
,100
)this
.wintof =
true}}
)}})
}}else,0
)}})
}else,0
)}})
}})}
}}}}
#button
.drag-test
.drag
.box
.footer
.footer div
.footer div span
.checkerboard
.piece
.piece:nth-child(3n-1)
白店小二手搓穿梭框
想當初我大四實習第一次面試的時候,機試題就是手寫出來穿梭框,不能用元件裡帶的,我當時在那傻坐了乙個多小時,也沒寫出來,尷尬!確實當時對於框架 元件都是能使用,但是不能問,問就是不會,更別說讓我寫個原生的了,理所當然的面試失敗,這也就成了我的乙個執念,我當時就想著我一定要自己把穿梭框給手搓出來,於是它...
白店小二的js知識 基礎
值型別 基本型別 字串 string 數字 number 布林 boolean 對空 null 未定義 undefined symbol。引用資料型別 物件 object 陣列 array 函式 function 注 symbol 是 es6 引入了一種新的原始資料型別,表示獨一無二的值。小知識 基...
白店小二的面試總結 閉包
閉包是指有權訪問另乙個函式作用域中的變數的函式,並且在閉包內部形成乙個外部無法訪問的區域性作用域。建立閉包的常見方式是在乙個函式內部建立另乙個函式。通過另乙個函式訪問這個函式的區域性變數,利用閉包可以突破作用鏈域,將函式內部的變數和方法傳遞到外部。閉包是一種機制 函式要訪問乙個變數的時候,就會先從自...