如何利用nodejs实现命令行游戏


Posted in NodeJs onNovember 24, 2020

本文以贪吃蛇为例, 一步一步地分析如何实现一个命令行游戏.

如何利用nodejs实现命令行游戏

实现原理

命令行输入

  • 通过 process.stdin 监听命令行输入的按键, 改变小蛇的前进的方向

画面渲染

  • 通过 ANSI 转义序列 擦除之前的输出
  • 通过 process.stdout 每隔一段时间将画面帧输出到命令行

源码解析

监听按键事件

使用过 yarn upgrade-interactive 命令更新 npm 依赖, 或者使用过 vue-cli 等脚手架创建过新项目的同学应该都见过: 这些工具会在命令行输出很多选项, 通过上下按键可以移动焦点, 通过空格键可以选择

那么这些操作是如何实现的呢? 下面通过 readline 和 process.stdin 来实现命令行监听按键事件:

process.stdin 是一个可读流, 通过 readline.emitKeypressEvents 可以给可读流注册 keypress 事件, 通过 keypress 事件就能获取到按键的值

readline.emitKeypressEvents(process.stdin) // 注册 keypress 事件

process.stdin.setRawMode(true) // 开启原始模式, 使输入的每个字符带上各种详细属性

process.stdin.on('keypress', (...args) => {
 console.log(args)
 // 按下方向键会输出
 // [
 //  undefined,
 //  {
 //   sequence: '\u001b[A',
 //   name: 'up',
 //   ctrl: false,
 //   meta: false,
 //   shift: false,
 //   code: '[A'
 //  }
 // ]
})

注意: setRawMode 会使命令行按下 ctrl + c 不再发送终止信号, 可能需要自行处理退出逻辑

绘制帧画面

输出到命令行的游戏画面默认为 30 行 x 50 列, 将其划分为一个二维数组, 每隔一段时间将二维数组的值打印出来并擦除之前打印的值, 即完成一次帧画面的渲染

process.stdout 是一个可写流, 调用 process.stdout.write 可以向命令行写入数据, nodejs 中 console.log 其实就是将数据写入到 process.stdout 并换行

通过向命令行写入开头为 ANSI 转义序列 的字符串可以 光标移动/滚动屏幕/擦除显示/颜色文本 等等功能, 想要深入了解可以自行搜索关键字学习, 本文使用 ansi-escapes npm 包实现擦除功能

const ansiEscapes = require('ansi-escapes')

function clear(lines) {
 process.stdout.write(ansiEscapes.eraseLines(lines)) // 可以擦除指定行数的输出
}

根据游戏画面的宽高定义一个二维数组, 小蛇的头和身体视为画面中的点, 值为非空值, 空白画面则为空字符串

let dots = []
for (let col = 0; col < wall.height; col++) {
 dots[col] = new Array(wall.width).fill(' ')
}

在每一帧中, 小蛇的头会向前进的方向前进一个, 头接着的第一节身体则会移动到上一帧头所在的位置, 以此类推每一节身体都会移动到前一节身体的位置上, 所以需要定义一个数据记录之前的头和身体的位置

const SNAKE_HEAD = '@' // 头的符号
const SNAKE_BODY = '○' // 身体的符号

function drawFrame() {
 let dots = []
 for (let col = 0; col < wall.height; col++) {
  dots[col] = new Array(wall.width).fill(' ')
 }

 let nextBody = []
 let head = next(snake.body[0]) // next 方法传入当前点的 x, y 坐标, 返回向前进方向前进一个的 x, y 坐标
 nextBody.push(head)
 dots[head.y][head.x] = SNAKE_HEAD
 for (let i = 1; i < snake.length; i++) {
  let body = snake.body[i - 1]
  dots[body.y][body.x] = SNAKE_BODY
  nextBody.push(body)
 }
 
 screen.draw(dots) // 将二维数组中的点输出到命令行中
 
 // 更新蛇的状态
 snake.body = nextBody
 snake.head = snake.body[0]
}

蛇吃鸟蛋逻辑

小蛇每吃到一个鸟蛋, 身体会长一节, 并在画面中随机生成另一个鸟蛋. 到了这一步其实就很简单了, 随机生成一个点作为鸟蛋的位置, 插入到之前的二维数组中.

function layAEgg() {
 let x = ~~(wall.width * Math.random())
 let y = ~~(wall.height * Math.random())
 return { x, y }
}

当小蛇的头的位置与鸟蛋的位置相同时, 则视为蛇吃到鸟蛋, 蛇的长度加一, 并在尾部增加一节上一帧蛇尾的节点位置

const SNAKE_HEAD = '@'
const SNAKE_BODY = '○'
const BIRD_EGG = '●'

function drawFrame() {
 let dots = []
 for (let col = 0; col < wall.height; col++) {
  dots[col] = new Array(wall.width).fill(' ')
 }

 let nextBody = []
 let head = next(snake.body[0])
 nextBody.push(head)
 dots[head.y][head.x] = SNAKE_HEAD
 for (let i = 1; i < snake.length; i++) {
  let body = snake.body[i - 1]
  dots[body.y][body.x] = SNAKE_BODY
  nextBody.push(body)
 }

 // 判断蛇头位置在上一帧中是否为鸟蛋位置, 为真视为蛇吃到鸟蛋
 if (prevDots && prevDots[head.y][head.x] === BIRD_EGG) {
  let body = snake.body[snake.length - 1]
  dots[body.y][body.x] = SNAKE_BODY
  nextBody.push(body)
  snake.length += 1
  egg = null
  prevDots = null
 }

 if (!egg) {
  egg = layAEgg()
  while (dots[egg.y][egg.x] !== ' ') {
   egg = layAEgg()
  }
 }
 dots[egg.y][egg.x] = BIRD_EGG

 prevDots = dots // 保存上一帧的数据, 用于下次绘制时判断逻辑

 screen.draw(dots)
 snake.body = nextBody
 snake.head = snake.body[0]
}

总结

至此, 命令行贪吃蛇游戏基本逻辑都已实现, 剩下的就是使用定时器每隔一段时间绘制一次帧画面. 其实几乎任何像素游戏(如俄罗斯方块/吃豆人等)都可以按照这个流程实现, 不同的只是帧画面的处理逻辑而已. 如果感兴趣的话, 可以去我的 github 查看该 贪吃蛇游戏源码

到此这篇关于如何利用nodejs实现命令行游戏的文章就介绍到这了,更多相关nodejs实现命令行游戏内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

NodeJs 相关文章推荐
使用nodejs下载风景壁纸
Feb 05 NodeJs
Nodejs搭建wss服务器教程
May 24 NodeJs
深入学习nodejs中的async模块的使用方法
Jul 12 NodeJs
nodejs 搭建简易服务器的图文教程(推荐)
Jul 18 NodeJs
nodejs body-parser 解析post数据实例
Jul 26 NodeJs
nodejs动态创建二维码的方法
Aug 12 NodeJs
用nodejs实现json和jsonp服务的方法
Aug 25 NodeJs
Nodejs中crypto模块的安全知识讲解
Jan 03 NodeJs
nodejs结合Socket.IO实现的即时通讯功能详解
Jan 12 NodeJs
nodeJS模块简单用法示例
Apr 21 NodeJs
nodejs实现获取本地文件夹下图片信息功能示例
Jun 22 NodeJs
nodejs二进制与Buffer的介绍与使用
Jul 11 NodeJs
NodeJS模块Buffer原理及使用方法解析
Nov 11 #NodeJs
nodejs中内置模块fs,path常见的用法说明
Nov 07 #NodeJs
Nodejs + sequelize 实现增删改查操作
Nov 07 #NodeJs
nodejs+koa2 实现模仿springMVC框架
Oct 21 #NodeJs
nodejs使用Sequelize框架操作数据库的实现
Oct 21 #NodeJs
用Nodejs实现在终端中炒股的实现
Oct 18 #NodeJs
Nodejs在局域网配置https访问的实现方法
Oct 17 #NodeJs
You might like
第十节 抽象方法和抽象类 [10]
2006/10/09 PHP
php 获取远程网页内容的函数
2009/09/08 PHP
sae使用smarty模板的方法
2013/12/17 PHP
解决php接收shell返回的结果中文乱码问题
2014/01/23 PHP
php中array_column函数简单实现方法
2016/07/11 PHP
PHP简单实现DES加密解密的方法
2016/07/12 PHP
newxtree.js代码
2007/03/13 Javascript
基于jquery实现的上传图片及图片大小验证、图片预览效果代码
2011/04/12 Javascript
js禁止页面使用右键(简单示例代码)
2013/11/13 Javascript
iScroll中事件点击触发两次解决方案
2015/03/11 Javascript
JS数字抽奖游戏实现方法
2015/05/04 Javascript
JS如何实现文本框随文本的长度而增长
2015/07/30 Javascript
jQuery tagsinput在h5邮件客户端中应用详解
2016/09/26 Javascript
JS简单实现点击跳转登陆邮箱功能的方法
2017/10/31 Javascript
浅谈React的最大亮点之虚拟DOM
2018/05/29 Javascript
原生JavaScript实现remove()和recover()功能示例
2018/07/24 Javascript
微信小程序实现日历功能
2018/11/27 Javascript
Vue实现手机扫描二维码预览页面效果
2020/05/28 Javascript
vue实现简单计算商品价格
2020/09/14 Javascript
[03:46]显微镜下的DOTA2第七期——满血与残血
2014/06/20 DOTA
Python中常用信号signal类型实例
2018/01/25 Python
python调用动态链接库的基本过程详解
2019/06/19 Python
Python 使用指定的网卡发送HTTP请求的实例
2019/08/21 Python
利用python-docx模块写批量生日邀请函
2019/08/26 Python
Linux下通过python获取本机ip方法示例
2019/09/06 Python
对Matlab中共轭、转置和共轭装置的区别说明
2020/05/11 Python
python3.8动态人脸识别的实现示例
2020/09/21 Python
Django中和时区相关的安全问题详解
2020/10/12 Python
css3隔行变换色实现示例
2014/02/19 HTML / CSS
巴西独家产品和现场演示购物网站:Shoptime
2019/07/11 全球购物
公司经营目标责任书
2015/01/29 职场文书
公司优秀员工推荐信
2015/03/24 职场文书
护士年终工作总结不会写?各科护士模板总结
2020/01/02 职场文书
mysql在项目中怎么选事务隔离级别
2021/05/25 MySQL
利用 JavaScript 构建命令行应用
2021/11/17 Javascript
mysql分组后合并显示一个字段的多条数据方式
2022/01/22 MySQL