Comment créer un jeu de tic-tac-toe en utilisant JS
Cette fois, je vais vous montrer comment utiliser JS pour créer un jeu Tic-Tac-Toe. Quelles sont les précautions pour utiliser JS pour créer un jeu Tic-Tac-Toe. Voici une application pratique. cas, jetons un coup d'oeil.
Un cours s'est récemment terminé et j'avais besoin de créer un jeu de tic-tac-toe. J'en ai écrit un en utilisant JavaScript. Tout d’abord, l’interface ne devrait pas poser de gros problème, écrivez-la simplement en HTML. Il s'agit principalement de l'algorithme d'IA utilisé dans les jeux homme-machine. Il convient de réfléchir à la manière de rendre les ordinateurs intelligents. Après avoir commencé le jeu, le joueur commence. D'un point de vue informatique, plusieurs situations peuvent être analysées et pondérées selon leur importance.
La situation est la suivante :
1 Il n'y a que deux pièces d'échecs dans la même rangée (ligne, colonne, diagonale), et elles sont toutes les deux les vôtres. , tant que vous allez plus loin, vous pouvez gagner, alors la position restante a le poids le plus élevé et la priorité la plus élevée. Attribuez un poids de premier niveau.
2. Il n'y a que deux pièces d'échecs dans la même rangée (ligne, colonne, diagonale), et elles sont toutes deux celles de l'adversaire (c'est-à-dire celles du joueur). réussir, donc "Je" Pour bloquer, la position restante reçoit un poids secondaire.
3. Parce que l'ordinateur recule, si vous êtes intelligent, vous devez bloquer le côté du joueur tout le temps. Par conséquent, lorsqu'il n'y a qu'une seule pièce d'échecs dans une rangée et que c'est la pièce d'échecs du joueur, puis les poids des autres positions de la ligne sont définis au niveau trois.
4. Poids de niveau 4 : Il n'y a que vos propres pièces d'échecs (côté ordinateur) dans une rangée.
5. Autorité de niveau 5 : Il n'y a pas de pièces d'échecs dans la même rangée, y compris celle de l'adversaire et la vôtre.
Une fois implémentées, les pièces d'échecs dans chaque position peuvent être représentées par un tableau bidimensionnel complet, et le poids de chaque position est également représenté par un tableau bidimensionnel val. Une fois que le joueur a fini de jouer, la fonction du côté IA est appelée. Avant que le côté IA ne bouge, il met d'abord à jour le poids, puis sélectionne la position avec le poids le plus élevé (solution optimale). Que ce soit l'IA ou le joueur, ils doivent déterminer s'il y a une victoire ou une perte après chaque coup. Utilisez la fonction alert() pour afficher les résultats.
Afin d'exprimer la taille du poids, il est stipulé qu'il faut ajouter 10000, 1000, 10, 5, 3 dans l'ordre du niveau un au niveau cinq
Remarque : Depuis le le code source devra peut-être être soumis, je ne l'ai pas séparé. Créez des styles css et des fichiers js, mais il est préférable de les écrire séparément pour être plus standardisés. S'il y a des lacunes, les critiques et les corrections sont les bienvenues.
Le code source est le suivant :
<html>
<head>
<meta charset="utf-8">
<title>井字棋</title>
<script>
//定义全局变量
var full=[[0,0,0],[0,0,0],[0,0,0]];//0表示null，1表示我下的，2表示电脑下的
var val=[[1,1,1],[1,1,1],[1,1,1]];//表示每个位置的权值
function judge(){
//检测是否有人赢
//行
for(var i=0;i<3;i++){
if(full[i][0]==full[i][1]&&full[i][1]==full[i][2]&&full[i][0]!=0){
if(full[i][0]==1){
window.alert("you win!");
return true;
}
else {
window.alert("you lose");
return true;
}
}
}
//列
for(var i=0;i<3;i++){
if(full[0][i]==full[1][i]&&full[1][i]==full[2][i]&&full[0][i]!=0){
if(full[0][i]==1){
window.alert("you win!");
return true;
}
else {
window.alert("you lose");
return true;
}
}
}
//主对角线
if(full[0][0]==full[1][1]&&full[1][1]==full[2][2]&&full[0][0]!=0){
if(full[0][0]==1){
window.alert("you win!");
return true;
}
else {
window.alert("you lose");
return true;
}
}
if(full[0][2]==full[1][1]&&full[2][0]==full[1][1]&&full[0][2]!=0){
if(full[0][2]==1){
window.alert("you win!");
return true;
}
else {
window.alert("you lose");
return true;
}
}
for(var i=0;i<3;i++){
for(var j=0;j<3;j++){
if(full[i][j]==0)
return false;//说明还没结束
if(i==2&&j==2)
{window.alert("平局！");
return true;
}
}
}
return false;//无结果
}
function bn(i,j){
//如果已经下过，则无效
if(full[i][j]!=0){
return 0;
}else{
//没下过
full[i][j]=1;
num1=(i*3+j+1)+"";
document.getElementById(num1).value="X";
if(judge()==true){
return;
}
ai();//切换
}
}
//重置权值：
function resetValue(){
for(var i=0;i<3;i++){
for(var j=0;j<3;j++){
if(full[i][j]!=0)
val[i][j]=0;
else{
//看行和列：
//最高权值
if(((full[0][j]+full[1][j]+full[2][j])==4)&&(full[0][j]*full[1][j]*full[2][j])==0
&&((full[0][j]-1)*(full[1][j]-1)*(full[2][j]-1))==-1)
val[i][j]=val[i][j]+10000;
if(((full[i][0]+full[i][1]+full[i][2])==4)&&(full[i][0]*full[i][1]*full[i][2])==0
&&((full[i][0]-1)*(full[i][1]-1)*(full[i][2]-1))==-1)
val[i][j]=val[i][j]+10000;
//次级权值
if(((full[0][j]+full[1][j]+full[2][j])==2)&&(full[0][j]*full[1][j]*full[2][j])==0
&&((full[0][j]-1)*(full[1][j]-1)*(full[2][j]-1))==0)
val[i][j]=val[i][j]+1000;
if(((full[i][0]+full[i][1]+full[i][2])==2)&&(full[i][0]*full[i][1]*full[i][2])==0
&&((full[i][0]-1)*(full[i][1]-1)*(full[i][2]-1))==0)
val[i][j]=val[i][j]+1000;
//三级权值（一排只有一个X）
if(((full[0][j]+full[1][j]+full[2][j])==1)&&(full[0][j]*full[1][j]*full[2][j])==0
&&((full[0][j]-1)*(full[1][j]-1)*(full[2][j]-1))==0)
val[i][j]=val[i][j]+10;
if(((full[i][0]+full[i][1]+full[i][2])==1)&&(full[i][0]*full[i][1]*full[i][2])==0
&&((full[i][0]-1)*(full[i][1]-1)*(full[i][2]-1))==0)
val[i][j]=val[i][j]+10;
//四级权值（一排只有一个O）
if(((full[0][j]+full[1][j]+full[2][j])==2)&&(full[0][j]*full[1][j]*full[2][j])==0
&&((full[0][j]-1)*(full[1][j]-1)*(full[2][j]-1))==1)
val[i][j]=val[i][j]+5;
if(((full[i][0]+full[i][1]+full[i][2])==2)&&(full[i][0]*full[i][1]*full[i][2])==0
&&((full[i][0]-1)*(full[i][1]-1)*(full[i][2]-1))==1)
val[i][j]=val[i][j]+5;
//五级权限（该行没有X或O）
if(((full[0][j]+full[1][j]+full[2][j])==0)&&(full[0][j]*full[1][j]*full[2][j])==0
&&((full[0][j]-1)*(full[1][j]-1)*(full[2][j]-1))==-1)
val[i][j]=val[i][j]+2;
if(((full[i][0]+full[i][1]+full[i][2])==0)&&(full[i][0]*full[i][1]*full[i][2])==0
&&((full[i][0]-1)*(full[i][1]-1)*(full[i][2]-1))==-1)
val[i][j]=val[i][j]+2;
//主对角线：同上
if((i==0&&j==0)||(i==2&&j==2)||(i==1&&j==1)){
if(((full[0][0]+full[1][1]+full[2][2])==4)&&(full[0][0]*full[1][1]*full[2][2])==0
&&((full[0][0]-1)*(full[1][1]-1)*(full[2][2]-1))==-1)
val[i][j]=val[i][j]+10000;
//次级权值
if(((full[0][0]+full[1][1]+full[2][2])==2)&&(full[0][0]*full[1][1]*full[2][2])==0
&&((full[0][0]-1)*(full[1][1]-1)*(full[2][2]-1))==0)
val[i][j]=val[i][j]+1000;
//三级权值（一排只有一个X）
if(((full[0][0]+full[1][1]+full[2][2])==1)&&(full[0][0]*full[1][1]*full[2][2])==0
&&((full[0][0]-1)*(full[1][1]-1)*(full[2][2]-1))==0)
val[i][j]=val[i][j]+10;
//四级权值（一排只有一个O）
if(((full[0][0]+full[1][1]+full[2][2])==2)&&(full[0][0]*full[1][1]*full[2][2])==0
&&((full[0][0]-1)*(full[1][1]-1)*(full[2][2]-1))==1)
val[i][j]=val[i][j]+5;
//五级权值（该行没有X或O）
if(((full[0][0]+full[1][1]+full[2][2])==0)&&(full[0][0]*full[1][1]*full[2][2])==0
&&((full[0][0]-1)*(full[1][1]-1)*(full[2][2]-1))==-1)
val[i][j]=val[i][j]+2;
}
//副对角线(同上)
if((i==0&&j==2)||(i==2&&j==0)||(i==1&&j==1)){
//一级
if(((full[0][2]+full[1][1]+full[2][0])==4)&&(full[0][2]*full[1][1]*full[2][0])==0
&&((full[0][2]-1)*(full[1][1]-1)*(full[2][0]-1))==-1)
val[i][j]=val[i][j]+10000;
//二级
if(((full[0][2]+full[1][1]+full[2][0])==2)&&(full[0][2]*full[1][1]*full[2][0])==0
&&((full[0][2]-1)*(full[1][1]-1)*(full[2][0]-1))==0)
val[i][j]=val[i][j]+1000;
//三级权值（一排只有一个X）
if(((full[0][2]+full[1][1]+full[2][0])==1)&&(full[0][2]*full[1][1]*full[2][0])==0
&&((full[0][2]-1)*(full[1][1]-1)*(full[2][0]-1))==0)
val[i][j]=val[i][j]+10;
//四级权值（一排只有一个O）
if(((full[0][2]+full[1][1]+full[2][0])==2)&&(full[0][2]*full[1][1]*full[2][0])==0
&&((full[0][2]-1)*(full[1][1]-1)*(full[2][0]-1))==1)
val[i][j]=val[i][j]+5;
//五级权值（该行没有X或O）
if(((full[0][2]+full[1][1]+full[2][0])==0)&&(full[0][2]*full[1][1]*full[2][0])==0
&&((full[0][2]-1)*(full[1][1]-1)*(full[2][0]-1))==-1)
val[i][j]=val[i][j]+2;
}
}
}
}
}
function ai(){
if(judge()==true){
return;
}
//挑选权值最大的
resetValue();
var mi=0,mj=0,temp=0;
for(var i=0;i<3;i++)
for(var j=0;j<3;j++){
if(val[i][j]>temp){
temp=val[i][j];
mi=i;
mj=j;
}
}
full[mi][mj]=2;
num1=(mi*3+mj+1)+"";
document.getElementById(num1).value="O";
if(judge()==true){
return;
}
}
function lose(){
window.alert("you lose");
location.reload();
}
</script>
</head>
<body>
<h1 align=center> 井字棋</h1>
<table border=2px bordercolor="blue"width="300"height="300" style="font-size:50 " align=center>
<tr>
<td><input type="button" id="1" Style="width:100px;height:100px;" value=" " onclick="bn(0,0)"/></td>
<td><input type="button" id="2" Style="width:100px;height:100px;" value=" " onclick="bn(0,1)"/></td>
<td><input type="button" id="3" Style="width:100px;height:100px;" value=" " onclick="bn(0,2)"/></td>
</tr>
<tr>
<td><input type="button" id="4" Style="width:100px;height:100px;" value=" " onclick="bn(1,0)"/></td>
<td><input type="button" id="5" Style="width:100px;height:100px;" value=" " onclick="bn(1,1)"/></td>
<td><input type="button" id="6" Style="width:100px;height:100px;" value=" " onclick="bn(1,2)"/></td>
</tr>
<tr >
<td><input type="button" id="7" Style="width:100px;height:100px;" value=" " onclick="bn(2,0)"/></td>
<td><input type="button" id="8" Style="width:100px;height:100px;" value=" " onclick="bn(2,1)"/></td>
<td><input type="button" id="9" Style="width:100px;height:100px;" value=" " onclick="bn(2,2)"/></td>
</tr>
</table>
<p ><input type="button" style="position:relative;left:500px;top:5px;width:100px;height:50px;" value="重新开始" onclick="location.reload() "/>
<input type="button" style="position:relative;left:550px;top:5px;width:100px;height:50px;" value="认 输" onclick="lose()"/>
</p>
<body>
</html>Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur. le site PHP chinois !
Lecture recommandée :
JS implémente l'algorithme de recherche, de tri et de déduplication le plus simple
Comment utiliser jQuery pour réaliser acquisition Couleur aléatoire
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Outils d'IA chauds
Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes
AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.
Undress AI Tool
Images de déshabillage gratuites
Clothoff.io
Dissolvant de vêtements AI
Video Face Swap
Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !
Article chaud
Outils chauds
Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit
SublimeText3 version chinoise
Version chinoise, très simple à utiliser
Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP
Dreamweaver CS6
Outils de développement Web visuel
SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)
Sujets chauds
1393
52
1205
24
Quelle doit être l'utilisation du processeur lorsque vous jouez ?
Feb 19, 2024 am 11:21 AM
Il est courant que les jeux ralentissent votre ordinateur car ils consomment beaucoup de ressources. Il est essentiel de comprendre l'utilisation de votre processeur lorsque vous jouez afin d'éviter de le surcharger. Par conséquent, garder une trace de l’utilisation appropriée du processeur est essentiel pour que votre expérience de jeu reste fluide. Dans cet article, nous examinerons l'utilisation appropriée du processeur que vous devez réaliser pendant l'exécution de votre jeu. Utilisation du processeur pendant le jeu L'utilisation du processeur est un indicateur important de la charge de travail du processeur et dépend des spécifications de performances du processeur. Les processeurs plus puissants ont généralement une utilisation plus élevée. Un processeur avec plus de cœurs et de threads peut améliorer les performances globales de votre système. La prise en charge multithread permet de libérer tout le potentiel de votre processeur. Dans les jeux, l'utilisation du processeur dépend de l'utilisation du processeur, ce qui peut affecter le jeu.
NAT Boost vs Qos pour les jeux ; lequel est le meilleur ?
Feb 19, 2024 pm 07:00 PM
Dans la situation actuelle où presque tous les jeux sont en ligne, il n'est pas conseillé d'ignorer l'optimisation du réseau domestique. Presque tous les routeurs sont équipés de fonctionnalités NATBoost et QoS conçues pour améliorer l'expérience de jeu des utilisateurs. Cet article explorera la définition, les avantages et les inconvénients de NATBoost et QoS. NATBoost vs Qos pour les jeux ; lequel est le meilleur ? NATBoost, également connu sous le nom de Network Address Translation Boost, est une fonctionnalité intégrée aux routeurs qui améliore leurs performances. C'est particulièrement important pour les jeux, car cela permet de réduire la latence du réseau, c'est-à-dire le temps nécessaire au transfert des données entre l'appareil de jeu et le serveur. En optimisant la méthode de traitement des données au sein du routeur, NATBoost atteint une vitesse de traitement des données plus rapide et une latence plus faible, modifiant ainsi le
Nvgpucomp64.dll provoque le crash des jeux PC Windows ;
Mar 26, 2024 am 08:20 AM
Si Nvgpucomp64.dll provoque des plantages fréquents de votre jeu, les solutions fournies ici peuvent vous aider. Ce problème est généralement dû à des pilotes de carte graphique obsolètes ou corrompus, à des fichiers de jeu corrompus, etc. La résolution de ces problèmes peut vous aider à résoudre les plantages du jeu. Le fichier Nvgpucomp64.dll est associé aux cartes graphiques NVIDIA. Lorsque ce fichier plante, votre jeu plante également. Cela se produit généralement dans des jeux comme LordsoftheFallen, LiesofP, RocketLeague et ApexLegends. Nvgpucomp64.dll plante les jeux sur un PC Windows si N
NVIDIA lance la fonction RTX HDR : les jeux non pris en charge utilisent des filtres AI pour obtenir de superbes effets visuels HDR
Feb 24, 2024 pm 06:37 PM
Selon les informations de ce site Web du 23 février, NVIDIA a mis à jour et lancé hier soir l'application NVIDIA, offrant aux joueurs un nouveau centre de contrôle GPU unifié, permettant aux joueurs de capturer des moments merveilleux grâce au puissant outil d'enregistrement fourni par le flotteur du jeu. fenêtre. Dans cette mise à jour, NVIDIA a également introduit la fonction RTXHDR. L'introduction officielle est jointe à ce site : RTXHDR est un nouveau filtre Freestyle basé sur l'IA qui peut introduire de manière transparente les superbes effets visuels de la plage dynamique élevée (HDR) dans les jeux qui ne le font pas. prend en charge à l'origine le HDR. Tout ce dont vous avez besoin est un moniteur compatible HDR pour utiliser cette fonctionnalité avec une large gamme de jeux basés sur DirectX et Vulkan. Une fois que le lecteur a activé la fonction RTXHDR, le jeu fonctionnera même s'il ne prend pas en charge la HD.
Introduction à la façon de télécharger et d'installer le jeu superpeople
Mar 30, 2024 pm 04:01 PM
Le jeu superpeople peut être téléchargé via le client Steam. La taille de ce jeu est d'environ 28 Go. Le téléchargement et l'installation prennent généralement une heure et demie. Voici un tutoriel de téléchargement et d'installation spécifique pour vous ! Nouvelle méthode pour postuler aux tests fermés globaux 1) Recherchez "SUPERPEOPLE" dans la boutique Steam (téléchargement du client Steam) 2) Cliquez sur "Demander l'accès aux tests fermés SUPERPEOPLE" en bas de la page de la boutique "SUPERPEOPLE" 3) Après avoir cliqué sur le bouton de demande d'accès, le jeu "SUPERPEOPLECBT" peut être confirmé dans la bibliothèque Steam 4) Cliquez sur le bouton d'installation dans "SUPERPEOPLECBT" et téléchargez
Où est Spider Solitaire dans Win11 Comment jouer au jeu Spider Solitaire dans Win11
Mar 01, 2024 am 11:37 AM
Amis qui ont joué suffisamment de chefs-d’œuvre AAA et de jeux mobiles, vous souhaitez revivre les jeux informatiques de votre enfance ? Alors cherchons ensemble Spider Solitaire dans Windows 11 ! Cliquez sur le menu Démarrer de l'interface, cliquez sur le bouton « Toutes les applications » ; cliquez sur « Toutes les applications ». Recherchez et sélectionnez « MicrosoftSolitaireCollection », qui est l'application de jeu de la série Solitaire de Microsoft ; Une fois le chargement terminé, entrez dans l'interface de sélection et recherchez « Spider Solitaire » ; sélectionnez « Spider Solitaire ». Même si l'interface a légèrement changé, elle est toujours la même qu'avant
![Le panneau de configuration Thrustmaster ne fonctionne pas ou ne s'affiche pas correctement [Corrigé]](https://img.php.cn/upload/article/000/887/227/170831073283375.jpg?x-oss-process=image/resize,m_fill,h_207,w_330)
Le panneau de configuration Thrustmaster ne fonctionne pas ou ne s'affiche pas correctement [Corrigé]
Feb 19, 2024 am 10:45 AM
Thrustmaster est une société spécialisée dans la production de volants de jeu et d'autres accessoires de jeu. Ses produits de volants sont très populaires dans la communauté des joueurs. Les paramètres du volant Thrustmaster peuvent être installés et ajustés à l'aide du panneau de configuration Thrustmaster. Si vous rencontrez des problèmes avec le panneau de commande qui ne fonctionne pas ou ne s'affiche pas, cela peut affecter votre expérience de jeu. Par conséquent, lorsque cela se produit, vous devez vérifier si la connexion est normale et vous assurer que le pilote du logiciel est correctement installé et mis à jour avec la dernière version. De plus, vous pouvez également essayer de redémarrer l'appareil ou de reconnecter l'appareil pour résoudre d'éventuelles pannes. Lorsque vous rencontrez des problèmes, vous pouvez vous référer au site officiel de Thrustmaster ou contacter le service client pour obtenir de l'aide. Comment accéder à Thrustma
ASUS publie une mise à jour du BIOS pour améliorer la stabilité des jeux sur les processeurs Intel de 13e et 14e génération
Apr 20, 2024 pm 05:01 PM
Selon les informations de ce site du 20 avril, ASUS a récemment publié une mise à jour du BIOS, qui améliore l'instabilité telle que les plantages lors de l'exécution de jeux sur les processeurs Intel de 13e/14e génération. Ce site avait précédemment signalé que des joueurs avaient signalé des problèmes, notamment lors de l'exécution de la version démo PC du jeu de combat « Tekken 8 » de Bandai Namco, même si l'ordinateur dispose de suffisamment de mémoire et de mémoire vidéo, le système plante et affiche un message d'erreur indiquant une mémoire insuffisante. Des problèmes de crash similaires sont également apparus dans de nombreux jeux tels que "Battlefield 2042", "Remnant 2", "Fortnite", "Lord of the Fallen", "Hogwarts Legacy" et "The Finals". RAD a publié un long article en février de cette année, expliquant que le problème de crash du jeu est une combinaison de paramètres du BIOS, d'une fréquence d'horloge élevée et d'une consommation d'énergie élevée des processeurs Intel.
