laya开发微信小游戏《奇异水族馆》之观察者模式应用

初学laya开发的微信小游戏终于上线啦！！！

过年耗费3个月空闲时间开发出来的小游戏，游戏内容是模仿小时候玩过的一款pc端游戏叫怪怪水族馆~~

微信搜《奇异水族馆》即可畅玩哦！！

暂时采用本地缓存游戏数据，后面引入游戏数据自动上传保存，功能模块还在开发中~

数据处理这块，主要采用了 javascript 的 Proxy 和 Object.defineProperty 原理，实现观察者模式，根据数据变动改变界面，对于开发体验来说是真香！！！

最近阅读了一下vue的源码，发现数据绑定也是同理，不过vue对数据监听绑定这块的处理的更加详细，继续深入学习一波~~

奉上自己封装实现的函数，整个游戏数据逻辑基本都是用这个，实属好用~~

    //对象属性增加或删除会触发函数调用this.proxyObjChange = (obj,caller,fun,args=[])=>{return new Proxy(obj, {deleteProperty(target,key){delete target[key]fun.apply(caller,args)return true;},set(target, propKey, value, receiver) {let oldData = target[propKey]let result =   Reflect.set(target, propKey, value, receiver);fun.apply(caller,[propKey,oldData,...args])return result}});}/* *  obj 监听的对象*  key 监听的对象中的某个字段*  caller 回调函数的作用域*  fun 数据变化后执行回调函数*  args 数据变化后执行回调函数传入的参数*  exeFun 是否立即执行一次回调函数**/this.setObjSet = (obj,key,caller,fun,args=[],exeFun)=>{let initVlaue = obj[key]Object.defineProperty(obj,key,{get:function(){return initVlaue},set:function(val){if(fun){let result = fun.apply(caller,[val,...args])if(result){initVlaue = val;}}else{initVlaue = val;}return initVlaue},})if(exeFun){obj[key] = obj[key]}}

专门一个文件放游戏数据处理模块

数据监听变动，调用对应函数

localStorage本地存储，保存游戏数据

以下是大概游戏界面

扫码体验

laya开发微信小游戏《奇异水族馆》之观察者模式应用相关推荐

新手入门：如何用Laya开发微信小游戏？
1.环境准备 1.1 LayaAirIDE 1.7.14版本才开始集成微信小游戏开发. 1.2 微信小游戏开发工具微信小游戏开发工具是小游戏开发与测试的环境,由于LayaAir引擎的开发者完全可以使 ...
使用Laya开发微信小游戏时无法使用位图字体解决方案
-前言- 依照Laya官方提供的位图字体使用方案时,在本地是可以正常使用的.当发布到微信小游戏上就没法使用.经过查找是缺少解析xml的库. -正文- 方案1:引入xml解析库缺少什么我们就引入什么, ...
微信小游戏申请注册流程+开发微信小游戏类目需要具备条件
微信小游戏申请注册流程+开发微信小游戏类目需要具备条件在这里先讲一下,小程序和小游戏前面的注册流程都是一样的,在注册完毕登录小程序后台后选择类目时需要注意一下,我下面讲解的是已经通过认证的服务号进行 ...
webpack + typescript 开发微信小游戏实践
源码地址微信小游戏版本技术选型使用typescript开发但是微信小游戏原生不支持 typescript 开发,于是探索一下使用ts开发微信小游戏 1. 创建小游戏使用测试号,创建一个使用官方示 ...
如何使用egret开发微信小游戏（一）Hello World
如何使用egret开发微信小游戏(一)Hello World 微信小游戏上线以来,凭借微信海量的用户,取得了巨大的成功,从跳一跳到大家一起来滑水,从2d游戏到3d游戏,许多游戏开发者都赚的盆满钵满,我 ...
Unity开发微信小游戏步骤
unity开发微信小游戏 https://gitcode.net/mirrors/wechat-miniprogram/minigame-unity-webgl-transform?utm_sourc ...
unity开发微信小游戏（5）- 微信好友排行榜
效果展示: 如果感觉文章有用的,也烦请大家多多支持(扫描上面二维码n(*≧▽≦*)n)!!❤❤❤ unity开发微信好友排行榜可以说是把我虐的体无完肤,但为了拿下这功能,硬壳了三天,把我所踩过的坑分享 ...
利用Phaser开发微信小游戏（排行榜小结）
利用Phaser开发微信小游戏(排行榜小结) 小游戏中的开放数据域可用来保存游戏 ...
Unity 开发微信小游戏初探
前言最近因项目需要开始研究Unity开发微信小游戏相关的知识.期间遇到各种坑,网上查阅的资料基本类似,无法解决自己遇到的问题.特用本文记录下过程,方便其他人遇到同样的问题时能够参考. 开发环境 Un ...

laya开发微信小游戏《奇异水族馆》之观察者模式应用

laya开发微信小游戏《奇异水族馆》之观察者模式应用相关推荐

最新文章

热门文章

laya开发微信小游戏《奇异水族馆》之 观察者模式应用

laya开发微信小游戏《奇异水族馆》之 观察者模式应用相关推荐

最新文章

热门文章

laya开发微信小游戏《奇异水族馆》之观察者模式应用

laya开发微信小游戏《奇异水族馆》之观察者模式应用相关推荐