21xrx.com
2024-11-22 11:46:26 Friday
登录
文章检索 我的文章 写文章
用JavaScript编写数独游戏
2023-06-10 09:38:01 深夜i     --     --
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];

  }

 }

});

  
  

评论区

{{item['qq_nickname']}}
()
回复
回复