![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js成长日记
cc_bbs
善待每一行代码的小菜鸟
展开
-
用cocos creator实现《我的世界》
我的世界》是一款非常流行的游戏,不过网上大多都是用unity还原实现的。那么用cocos实现一版,会是怎样的开发体验呢?核心技能包括八叉树查询用于场景管理,射线检测用于碰撞和交互,柏林函数用于地形随机,动态网格用于地形显示。后续需进行场景性能优化,增加资源、NPC、存档、红石等等等等内容。对于长期学习,还是非常不错的项目。原创 2022-12-14 14:18:48 · 450 阅读 · 0 评论 -
typescript实现四叉树
使用了typescript实现了简单的四叉树。可以用于简单的静态场景管理。原创 2022-12-12 20:13:22 · 402 阅读 · 0 评论 -
2.5D游戏,角色移动限制方法。不用空气墙。
制作2.5D迷宫的时候,需要进行路线边缘判断。一种比空气墙碰撞有更高效率的判断方法。原创 2022-12-09 21:42:12 · 1278 阅读 · 0 评论 -
八叉树的范围和射线检测
用typescript实现一下八叉树的范围和射线检测原创 2022-11-30 20:59:58 · 433 阅读 · 0 评论 -
typescript 八叉树的简单实现
第一次尝试八叉树构建,用ts写一个。原创 2022-11-27 20:13:08 · 732 阅读 · 0 评论 -
typescript为数字填充0
在计时或者计分的场景中,需要为数字填充0进行显示。写了一个ts方法。原创 2022-11-03 10:38:40 · 605 阅读 · 0 评论 -
基于ts泛型实现的提示友好型事件管理器
利用vscode的智能提示和ts的泛型语法,实现了一个类型提示友好的事件管理器。原创 2022-10-23 20:29:31 · 1997 阅读 · 0 评论 -
typescript设计模式SOLID原则一览
用几个反例和纠正来介绍一下设计模式solid原则在typescript语言里的简单使用。原创 2022-07-16 00:45:07 · 260 阅读 · 0 评论 -
cocos creator effect圆形头像
作用:使用材质裁剪矩形图片为圆形。效果:左侧为原图,右侧为裁剪后的效果(上方为设置透明度,下方为discard)实现思路:因为要适应不同尺寸的图片,所以使用了椭圆的方程。保证短方向撑满,长方向长度等于短方向。因为glsl的v_vu0是0到1,所以将长方向缩短一定比例即可。椭圆公式:实现:1:定义effect uniform变量(0.25的默认值是因为a,b分母是平方)2:带入v_uv0的坐标到椭圆坐标里,如果大于1,则放弃绘制。...原创 2021-08-08 15:13:59 · 707 阅读 · 0 评论 -
记录cocos creator index.html里设置gamecanvas 的display为none导致的无法点击场景的bug
问题产生:需要在原生js里切换cocos场景和原生场景。所以刚开始就把gameCanvas的display设置成为了none。过一会儿条件达到再显示。但是导致的问题是场景里的按钮无法点击。简单还原:这样一秒后游戏场景显示,但是按钮无法点击。开始破案:破案的时候,用调试模式打包。这样就可以利用调用堆栈进行调试。我们先不隐藏和显示,然后点击按钮查看调用堆栈。嗯,正常走到了doSome的函数。然后我们先隐藏后显示。因为我们知道肯定不能走到doSome。所以就往后一步步.原创 2021-08-06 16:08:17 · 613 阅读 · 0 评论 -
nodejs fs从json中按二级对象读取
json示例{ "a": { "b": 1, "c": "f" }, "m": { "b": 3, "c": "sdf" }}nodejs读取代码:readDocument(endOneCb_) { const _bufferArr = []; const _stack = []; let _canBufferPush = false;原创 2021-07-18 00:17:08 · 394 阅读 · 0 评论 -
js string转uint8array
手写转换:function toUint8Arr(str) { const buffer = []; for (let i of str) { const _code = i.charCodeAt(0); if (_code < 0x80) { buffer.push(_code); } else if (_cod原创 2021-07-15 00:15:04 · 6103 阅读 · 0 评论 -
html和node的eventloop执行区别
该文已经介绍的很详细了我这里只是写一个更短的例子来说明一下:html和node代码一样:console.log(1); setTimeout(() => { Promise.resolve(console.log(2)) .then(() => console.log(3)) }); setTimeout(() => { Promise.resolve(console.log(4))原创 2021-07-14 09:30:05 · 67 阅读 · 0 评论 -
简单记录上传blob和base64保存图片
学习了一下客户端和服务器利用ajax上传图片的技术。利用了ajax的post方法和nodejs的http、fs模块没有用formdata。直接上传blob和base64.上传和接收blob客户端代码:直接上传blob数据<body> <input type="file"> <input type="button" value="click" onclick="upload()"></body><script&g原创 2021-07-13 13:34:29 · 214 阅读 · 0 评论 -
canvas绘制下载的图片
上代码:<body> <canvas width="300" height="300" id="cvs"></canvas> <script> const cvs = document.getElementById('cvs'); const ctx = cvs.getContext('2d'); function getPic() { const xhr = new原创 2021-07-12 16:38:19 · 147 阅读 · 0 评论 -
资源中转服务器:解决跨域
用creator开发网页游戏。想要本地测试。静态资源放在了服务器。如果电脑测试,可以设置浏览器跨域。但是手机测试,就没找到设置浏览器跨域的方法。所以就使用资源中转服务器的方法。需要使用nodejs相关功能。http模块。用http开启中转服务器,然后浏览器将资源获取地址改为本地中转服务器地址。代码如下:const http = require('http');const urlBase = '${你的最终服务器地址}'http.createServer((req, res原创 2021-07-12 13:09:17 · 247 阅读 · 0 评论 -
V8隐藏类
V8引擎为了优化对象属性查找效率。引入了隐藏类。即每当创建对象的时候,就会为他创建一个影藏类,用来记录对象的属性在内存中的位置相对于对象在内存中的位置的偏移量。相同结构的字面量对象,会共享同一个隐藏类。比如:const a={x:1,y:2,c:3}和const b={x:4,y:5,c:6}虽然a和b里面属性的值不一样。但是共享了同一个隐藏类。不过:const a={x:1}a.y=2;和const b={x:1,y:2}没有有共享同一个隐藏类?原创 2021-06-29 11:07:10 · 332 阅读 · 1 评论 -
记录node自定义command
想一个命令名字:xxx npm init 创建package.json文件 创建一个command命令解析文件yyy(可与命令重名或者不重名) 在package.json里添加bin:{xxx:"yyy"} 在yyy的第一行添加:#!/usr/bin/envnode 在目录下运行npm link 最后就可以在cmd里运行xxx查看效果了#!/usr/bin/envnode的用处是告诉文件处理器应该使用什么解析器来执行文件,这里是用node执行。相当于在目录下cmd然后输入nod..原创 2021-06-25 16:23:14 · 364 阅读 · 0 评论 -
png了解
png图片信息有3个不可选关键数据块:IHDR,IDAT,IEND和一个头PNG其中:IHDR包含了宽、高、色深、颜色类型、压缩方法等几个信息。IDAT包含了实际的图片信息IEND为结束块每个块由4部分组成(顺序):数据长度(length):4字节,比如0x00 0x00 0x00 0x10 表示改块数据长度为16块类型码(chunk code):4字节,比如0x49 0x44 0x41 0x54 表示IDAT块数据(data):长度由length决定,原创 2021-06-24 16:57:20 · 232 阅读 · 0 评论 -
js generate 实现hello world
function* showHelloWorld() { let _s = ''; _s += yield p1; _s += ' '; _s += yield p2; console.log(_s); //hello world}function p1(cb_) { setTimeout(() => { cb_('hello'); }, 1000);}function p2(cb_) { setTimeou.原创 2021-06-24 10:36:15 · 309 阅读 · 0 评论 -
js generate结合promise实现hello world
function* showHelloWorld() { let _s = ''; _s += yield asyncFun(p1); _s += ' '; _s += yield asyncFun(p2); console.log(_s); //hello world}function asyncFun(cb_) { return new Promise(cb_)}function p1(cb_) { setTimeout(() =&g.原创 2021-06-24 10:21:23 · 132 阅读 · 0 评论 -
webpack的初步理解
最近开始学习node,先简单记录一下自己理解的为什么要有webpack:为了在html里引入单个js我们在写html的时候,如果想要做一些js处理,一般的做法是写在<script>标签里。<html><head></head><body></body><script> console.log('hello world');</script></html>当代码量变多的时原创 2021-05-19 10:46:04 · 66 阅读 · 0 评论 -
nodejs http 发送html文件到浏览器
初学nodejs,记录一下用http模块实现浏览器输入地址到收到本地服务器的html文件。步骤:创建本地服务器js文件 创建主页html文件 在浏览器上输入地址本来想直接测试http的form提交。但是进行了跳转。然后用ajax避免跳转,但是又涉及同源。所以就用服务器返回html文件的方式。只记录最重要的第一步:创建服务器js文件const Http = require('http');//引用http模块。其继承了net模块。const fs = require('f原创 2021-05-16 00:07:57 · 1416 阅读 · 0 评论 -
JavaScript中断foreach
狸猫换太子 式let a = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];a.forEach((v, i, arr) => { if (v === 5) { a = [...a]; arr.splice(i); }})console.log(a);//[1, 2, 3, 4, 5, 6, 7, 8, 9, 0]这种方法打印的a其实已经是另一个数组对象了。在中断的时候进行了一次浅拷贝,并把原来的a裁剪了。因为..原创 2021-04-28 00:07:20 · 233 阅读 · 0 评论 -
js正则表达式获得url参数
如果只需要值可以写成这样:function getValueArray(url_){ return url_.match(/(?<=[\?&]\w+=)[^&]+(?=(&|$))/g));}需要注意:小括号里可以写$这样的标识符,而中括号里的值只有字符。如果需要包含key和value并且以object形式返回则写成这样:function getKeyValueObject(url_){ return [{}].concat(url_.m原创 2021-04-15 00:36:01 · 1031 阅读 · 0 评论 -
js正则表达式的易混淆一
这里写一下regexp的exec和string的match的混淆理清。第一点是:exec和match都是返回一个数组。第二点是:exec第一个元素是找到的那个匹配项。后面的元素都是小括号里的值。比如:/(a)/.exec('a'); //['a','a']返回的数组第二个元素就是第一个小括号里的值。第三点是:如果match没有g(全局)标识符。那么和exec是一样的。比如:'a'.match(/(a)/); //['a','a']返回的数组第二个元素也是第一个小括号原创 2021-04-14 23:03:57 · 100 阅读 · 0 评论 -
js __proto__和prototype理解
先看一段输出:var f=new Function();console.log(f.__proto__===Function.prototype);//trueconsole.log(f.prototype);//{constructor:f}console.log(f.prototype.__proto__===Object.prototype);//trueconsole.log(f.__proto__.__proto__===Object.prototype);//trueconsole.原创 2021-02-18 00:22:17 · 153 阅读 · 0 评论 -
android studio+creator+微信登录。注意点记录。
1:gradle添加阿里云代理。很多问题都是由下载不下来导致的。buildscript { repositories { maven { url "https://maven.aliyun.com/repository/google" } maven{ url 'https://maven.aliyun.com/repository/jcente...原创 2020-05-01 14:43:43 · 223 阅读 · 0 评论 -
js获取html子节点的方法--非找id
认为针对子节点也设置id会让id很泛滥。所以用了个别的办法来获取子节点。在网上没找到相关的信息。自己摸索出来的。用children和name实现如下:<div id="div"><div name="childdiv"></div></div>这样获取:document.getElementById("div").chil...原创 2020-01-08 13:58:46 · 431 阅读 · 0 评论 -
微信登陆坑记录。共勉
1:创建wxapi包,需要放在buildconfig中APPLICATION_ID包下。不然没有回调。2:创建WXEntryActivity类文件,不要继承Cocos2dxActivity。不然会导致回调后闪退。...原创 2019-12-30 14:57:38 · 124 阅读 · 0 评论 -
计分板程序js代码
999分上限_funcSetScore(score_) {let _s = score_.toString();for (let i = 0; i < 3 - _s.length; i++) {_s = '0' + _s;}let _array = _s.split('').reverse();for (let i in _array) {this.array...原创 2019-10-31 14:16:18 · 988 阅读 · 0 评论 -
JS 将数字变成汉字数字
工作中需要将阿拉伯数字转成汉字数字。比如15改成十五,3240改成三千二百四十等。测了一下暂时没发现什么问题。只支持千位以内。var _arrayCHNNum=['〇','一','二','三','四','五','六','七','八','九'];var _arrayCHNBit=['','十','百','千'];funcChangeNumToCHN(s_){ let ...原创 2019-08-20 09:45:53 · 2953 阅读 · 0 评论