资讯专栏INFORMATION COLUMN

JavaScript实现的水果忍者游戏,支持鼠标操作

huhud / 3122人阅读

摘要:智能手机刚刚普及时,水果忍者这款小游戏可谓风靡一时。几年过去了,现在,让我们用纯来实现这个水果忍者游戏,就算是为了锤炼我们的开发技能吧。那么只需要修改函数,如下图的红色分支就是切到水果的分支,执行加分和显示水果被切成两半的效果。

智能手机刚刚普及时,水果忍者这款小游戏可谓风靡一时。几年过去了,现在,让我们用纯JavaScript来实现这个水果忍者游戏,就算是为了锤炼我们的JavaScript开发技能吧。

大家可以通过这个链接在线玩一玩(该链接是我的github地址):

http://i042416.github.io/Fior...

用鼠标在网页上划一条横线切正中的“New Game”的水果开始新的游戏:

然后按住鼠标左键不放,在屏幕上划一条线,即可去切您中意的水果了。

玩法和手机上一样简单。

如果大家想定制化水果忍者这个游戏,请从我的github上将水果忍者的源代码clone或者下载到本地,然后自行修改:

https://github.com/i042416/Fi...

如果大家想修改在游戏里登场的水果图标,直接把文件夹images/fruit下面的图片文件替换即可。以苹果为例,apple.png代表完整的苹果,apple-1.png和apple-2.png分别代表被切成两半的苹果左半部份和右半部份。

如果想修改游戏音效,请将您喜欢的音效的mp3文件放到sound文件夹下。

我们在玩这个游戏时,如果在JavaScript文件all.js的slice事件处理函数里设置断点,就能观察到JavaScript实现是如何检测水果刀(是否)切到了水果:collide.check:

如果大家觉得只有三次机会玩起来太不过瘾了,那很容易,直接把showLseAt这个函数里的number == 3的判断条件改成比如number == 999, 这样就可以几乎无限制得玩啦!

有的朋友想作弊得更彻底一点,想达到即使切到炸弹,游戏也不结束的效果。

那么只需要修改sliceAt函数,如下图if ( fruit.type != "boom")的红色分支就是切到水果的分支,执行加分和显示水果被切成两半的效果。else的蓝色分支是切到炸弹的分支,我们只需要将蓝色分支内的代码注释掉,游戏就永远不能结束了。不过这样挺无聊的,哈哈!

这个游戏的JavaScript版本的作者:https://github.com/ChineseDro...

要获取更多Jerry的原创技术文章,请关注公众号"汪子熙"或者扫描下面二维码:

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/98560.html

相关文章

  • Python+Pygame实操之玩命吃水果游戏完成

      吃豆人和削苹果这两个游戏想必大家都知道吧,本文运用Python里的Pygame控制模块编写出一个融合吃豆人+切水果的新手游:玩命吃苹果,有兴趣的话可以认识一下  引言  哈哈哈!木木子今天浮现——早已来给大家看了不少具体内容啦~  涉及到的人工智能、新手、网络爬虫、数据统计分析(这一块的通常但是审批)手机游戏...  PS:  吃豆人我写过了哈  Python+Pygame实战之吃豆豆游戏的实...

    89542767 评论0 收藏0
  • 深入理解js

    摘要:详解十大常用设计模式力荐深度好文深入理解大设计模式收集各种疑难杂症的问题集锦关于,工作和学习过程中遇到过许多问题,也解答过许多别人的问题。介绍了的内存管理。 延迟加载 (Lazyload) 三种实现方式 延迟加载也称为惰性加载,即在长网页中延迟加载图像。用户滚动到它们之前,视口外的图像不会加载。本文详细介绍了三种延迟加载的实现方式。 详解 Javascript十大常用设计模式 力荐~ ...

    caikeal 评论0 收藏0
  • JS忍者秘籍中定时器机制详解

    摘要:设置和清除定时器直接引用忍者秘籍中的图片注意定时器的时间间隔设为,也会有几毫秒的延迟。以上参考资料忍者秘籍第章驯服线程和定时器 showImg(https://segmentfault.com/img/remote/1460000015353524?w=1024&h=681); 前言 前段时间刚看完《JS忍者秘籍》,虽说是15年出版的,有些东西是过时了,但像对原型链、闭包、正则、定时器...

    keelii 评论0 收藏0

发表评论

0条评论

huhud

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<