21xrx.com
2025-06-02 17:04:15 Monday
文章检索 我的文章 写文章
用JavaScript编写数独游戏
2023-06-10 09:38:01 深夜i     31     0
JavaScript 数独 递归

我最近迷上了JavaScript编程,而且我还喜欢玩数独游戏。于是我决定将这两个爱好结合起来,开发一个JavaScript数独游戏。

首先我需要定义一个数独谜题。我创建了一个二维数组来表示谜题。其中,0表示空格,而其他数字表示该单元格中的数字。下面是一个示例谜题:

script
var puzzle = [
 [0, 1, 0, 0, 0, 0, 0, 9, 0],
 [0, 0, 0, 0, 5, 8, 0, 0, 4],
 [3, 5, 0, 0, 9, 0, 2, 0, 0],
 [5, 0, 0, 6, 0, 0, 0, 0, 9],
 [0, 0, 0, 0, 7, 0, 0, 0, 0],
 [4, 0, 0, 0, 0, 5, 0, 0, 2],
 [0, 0, 3, 0, 0, 0, 0, 5, 1],
 [7, 0, 0, 9, 3, 0, 0, 0, 0],
 [0, 0, 0, 0, 0, 0, 0, 0, 0]
];

接下来,我定义了检查某个数字在单元格中是否合法的函数。代码如下:

script
function checkNumber(row, col, num) {
 // 检查同一行是否存在相同数字
 for (var i = 0; i < 9; i++) {
  if (puzzle[row][i] == num)
   return false;
  
 }
 
 // 检查同一列是否存在相同数字
 for (var i = 0; i < 9; i++) {
  if (puzzle[i][col] == num)
   return false;
  
 }
 
 // 检查同一九宫格是否存在相同数字
 var startRow = Math.floor(row / 3) * 3;
 var startCol = Math.floor(col / 3) * 3;
 for (var i = startRow; i < startRow + 3; i++) {
  for (var j = startCol; j < startCol + 3; j++) {
   if (puzzle[i][j] == num)
    return false;
   
  }
 }
 
 return true;
}

最后,我定义了一个函数,用于填写数独。它的实现方式是递归。代码如下:

script
function solvePuzzle() {
 for (var row = 0; row < 9; row++) {
  for (var col = 0; col < 9; col++) {
   if (puzzle[row][col] == 0) {
    for (var num = 1; num <= 9; num++) {
     if (checkNumber(row, col, num)) {
      puzzle[row][col] = num;
      if (solvePuzzle())
       return true;
      
      puzzle[row][col] = 0;
     }
    }
    return false;
   }
  }
 }
 return true;
}

最后,我将谜题加载到网页中,并在网页上显示数独游戏。下面是完整的JavaScript数独游戏代码。

script
var puzzle = [
 [0, 1, 0, 0, 0, 0, 0, 9, 0],
 [0, 0, 0, 0, 5, 8, 0, 0, 4],
 [3, 5, 0, 0, 9, 0, 2, 0, 0],
 [5, 0, 0, 6, 0, 0, 0, 0, 9],
 [0, 0, 0, 0, 7, 0, 0, 0, 0],
 [4, 0, 0, 0, 0, 5, 0, 0, 2],
 [0, 0, 3, 0, 0, 0, 0, 5, 1],
 [7, 0, 0, 9, 3, 0, 0, 0, 0],
 [0, 0, 0, 0, 0, 0, 0, 0, 0]
];
function checkNumber(row, col, num) {
 // 检查同一行是否存在相同数字
 for (var i = 0; i < 9; i++) {
  if (puzzle[row][i] == num)
   return false;
  
 }
 
 // 检查同一列是否存在相同数字
 for (var i = 0; i < 9; i++) {
  if (puzzle[i][col] == num)
   return false;
  
 }
 
 // 检查同一九宫格是否存在相同数字
 var startRow = Math.floor(row / 3) * 3;
 var startCol = Math.floor(col / 3) * 3;
 for (var i = startRow; i < startRow + 3; i++) {
  for (var j = startCol; j < startCol + 3; j++) {
   if (puzzle[i][j] == num)
    return false;
   
  }
 }
 
 return true;
}
function solvePuzzle() {
 for (var row = 0; row < 9; row++) {
  for (var col = 0; col < 9; col++) {
   if (puzzle[row][col] == 0) {
    for (var num = 1; num <= 9; num++) {
     if (checkNumber(row, col, num)) {
      puzzle[row][col] = num;
      if (solvePuzzle())
       return true;
      
      puzzle[row][col] = 0;
     }
    }
    return false;
   }
  }
 }
 return true;
}
// 加载数独谜题到网页
var puzzleTable = document.getElementById('puzzle');
for (var row = 0; row < 9; row++) {
 var tr = document.createElement('tr');
 for (var col = 0; col < 9; col++) {
  var td = document.createElement('td');
  if (puzzle[row][col] == 0) {
   var input = document.createElement('input');
   input.type = 'text';
   input.size = 1;
   input.maxLength = 1;
   input.style.textAlign = 'center';
   td.appendChild(input);
  } else {
   td.textContent = puzzle[row][col];
  }
  tr.appendChild(td);
 }
 puzzleTable.appendChild(tr);
}
// 处理提交按钮的点击事件
var submitButton = document.getElementById('submit');
submitButton.addEventListener('click', function() {
 for (var row = 0; row < 9; row++) {
  for (var col = 0; col < 9; col++) {
   var input = puzzleTable.rows[row].cells[col].querySelector('input');
   if (input) {
    puzzle[row][col] = parseInt(input.value);
   }
  }
 }
 solvePuzzle();
 for (var row = 0; row < 9; row++) {
  for (var col = 0; col < 9; col++) {
   puzzleTable.rows[row].cells[col].textContent = puzzle[row][col];
  }
 }
});

  
  

评论区

    相似文章