给我一个js写的象棋游戏的代码
时间: 2023-08-31 09:19:20 浏览: 54
### 回答1:
好的,这是一个简单的 JavaScript 象棋游戏的代码示例:
```
// 定义棋盘大小
const boardSize = 8;
// 定义棋子类型
const PieceType = {
PAWN: "pawn",
KNIGHT: "knight",
BISHOP: "bishop",
ROOK: "rook",
QUEEN: "queen",
KING: "king",
};
// 定义棋子颜色
const PieceColor = {
WHITE: "white",
BLACK: "black",
};
// 定义棋子类
class Piece {
constructor(type, color, position) {
this.type = type;
this.color = color;
this.position = position;
}
// 移动棋子
move(newPosition) {
this.position = newPosition;
}
}
// 定义棋盘类
class Board {
constructor() {
this.grid = [];
for (let i = 0; i < boardSize; i++) {
this.grid[i] = new Array(boardSize).fill(null);
}
}
// 在指定位置放置棋子
placePiece(piece, position) {
this.grid[position[0]][position[1]] = piece;
}
}
// 创建棋盘
const board = new Board();
// 创建棋子
const pawn = new Piece(PieceType.PAWN, PieceColor.WHITE, [1, 0]);
// 在棋盘上放置棋子
board.placePiece(pawn, [1, 0]);
// 移动棋子
pawn.move([2, 0]);
```
这个代码实现了创建棋子、棋盘和移动棋子的功能。它可以作为象棋游戏的基础,你可以在此基础上增加更多功能来完善游戏。
希望这对你有帮助。
### 回答2:
下面是一个简单的用 JavaScript 编写的象棋游戏代码示例:
```html
<!DOCTYPE html>
<html>
<head>
<style>
.board {
display: grid;
grid-template-columns: repeat(9, 50px);
grid-template-rows: repeat(10, 50px);
gap: 2px;
background-color: #EEEED1;
padding: 10px;
width: 500px;
}
.cell {
display: flex;
justify-content: center;
align-items: center;
font-weight: bold;
font-size: 20px;
background-color: #F9F5D7;
}
</style>
</head>
<body>
<div class="board"></div>
<script>
// 创建象棋棋盘
function createBoard() {
const boardContainer = document.querySelector('.board');
for (let i = 0; i < 90; i++) {
const cell = document.createElement('div');
cell.className = 'cell';
boardContainer.appendChild(cell);
}
}
// 设置棋子
function setPiece(cell, piece) {
const index = Array.from(cell.parentNode.children).indexOf(cell);
cell.innerHTML = piece;
}
// 初始化棋盘和棋子
function init() {
createBoard();
const cells = document.querySelectorAll('.cell');
const pieces = ['車', '馬', '相', '仕', '将', '仕', '相', '馬', '車',
' ', ' ', ' ', ' ', ' ', ' ', ' ', ' ',
' ', '炮', ' ', ' ', ' ', ' ', ' ', '炮',
'卒', ' ', '卒', ' ', '卒', ' ', '卒', '卒',
' ', ' ', ' ', ' ', ' ', ' ', ' ', ' ',
' ', ' ', ' ', ' ', ' ', ' ', ' ', ' ',
'兵', '兵', '兵', '兵', '兵', ' ', '兵', '兵',
' ', '砲', ' ', ' ', ' ', ' ', ' ', '砲',
' ', ' ', ' ', ' ', ' ', ' ', ' ', ' ',
'俥', '傌', '象', '士', '帥', '士', '象', '傌', '俥'];
cells.forEach((cell, index) => setPiece(cell, pieces[index]));
}
// 初始化象棋游戏
init();
</script>
</body>
</html>
```
这段代码通过使用 HTML 和 JavaScript 创建了一个简单的象棋棋盘,并将棋子放置在正确的位置。你可以在网页上运行这段代码,就可以看到一个简化版本的象棋游戏界面。
### 回答3:
以下是一个简单的用JavaScript编写的象棋游戏代码示例:
```javascript
// 定义象棋棋盘的二维数组,使用0表示空位置
var chessBoard = [
[1, 2, 3, 4, 5, 4, 3, 2, 1],
[0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 6, 0, 0, 0, 0, 0, 6, 0],
[7, 0, 7, 0, 7, 0, 7, 0, 7],
[0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0],
[14, 0, 14, 0, 14, 0, 14, 0, 14],
[0, 13, 0, 0, 0, 0, 0, 13, 0],
[12, 11, 10, 9, 8, 9, 10, 11, 12]
];
// 定义棋子的类型和位置
var pieces = {
'1': '車',
'2': '馬',
'3': '象',
'4': '士',
'5': '将',
'6': '炮',
'7': '卒',
'8': '車',
'9': '馬',
'10': '相',
'11': '仕',
'12': '帥',
'13': '砲',
'14': '兵'
};
// 输出棋盘的函数
function displayChessBoard() {
for (var i = 0; i < chessBoard.length; i++) {
var row = '';
for (var j = 0; j < chessBoard[i].length; j++) {
if (chessBoard[i][j] === 0) {
row += ' ';
} else {
row += pieces[chessBoard[i][j]] + ' ';
}
}
console.log(row);
}
}
// 测试
displayChessBoard();
```
这个代码片段实现了一个简单的控制台象棋游戏,通过二维数组表示棋盘,通过`pieces`对象保存棋子的类型和位置信息。最后通过`displayChessBoard`函数来输出棋盘。运行代码会在控制台显示当前棋盘的状态。