资深程序员-5年大厂经验代码究竟写的如何-H5-WEBgl-typeScript的笔记代码之一

目录

这个文章拖了有2个月了吧

大概的Feature

数组.reduce()

数组.concat()

数组元素统计

数组去重

参考 reduce() 方法实战

---

这个文章拖了有2个月了吧

大部分出于一个资深同事的交接文档，此人不爱写备注

所以想不到怎么吐槽他好，吐槽可能会在下一个文章之二，补充

1.前同事的逻辑能力肯定时很好的，性格好，也很适合做程序员，

俗称的”能出活“，只是真的是输出上去了，工资也上去了，公司"给不起"

2.他本身也不擅长写typeScript;重新学习一种语言的能力也是很强的，解决问题能力

3.可以当别人的学习笔记的观摩

大概的Feature

• cocoscreator去掉loading 默认logo
• 网页出现Welcome to nginx
• cocoscreator 固定旋转 一节点在区域循环旋转
• cocoscreator canvas改大小
• 撤除组件的预制体
• 用cc.loader加载和删除预制体
• cocos 获取网络手机状态
• cocos 熟悉动画编辑器（实际上，最后完成了5，6个动画都不是官方的动画编辑器，是实打实程序基本功）
• cocos 关键帧过渡
• 脚本控制播放
• LayaAir LayaBox
• cocos 快速定位丢失资源
• 华为鸿蒙系统 安装 谷歌服务框架
• 场景切换时清理缓存CCTextureCache , SpriteFrame清理
• 资源加载资源分包-动画剪辑

........................

数组.reduce()

//reduce()是对数组的一个方法
 
let arr=[1,2,3,4,5,6]
let res=arr.reduce((a,b)=>{
	return a+b
})
console.log(res)//3*7 == 21
//这是对数组求和，如果数组中出现了字符串，那么字符串前的数字还是会求和，
//字符串之后的数字都会以字符串的形式相加起来

数组.concat()

 
let arr=[[1,2],[2,3],[4,5],[6,7]]
let res=arr.reduce((a,b)=>{return a.concat(b)})
console.log(res)//[1,2,2,3,4,5,6,7]
//这是合并二维数组

数组元素统计

let arr=['B','A','A','B','C','B','G']
let res =arr.reduce((a,b)=>{
    a[b]=(a[b]+1)||1;
    return a;
},{})
console.log(res)//{B: 3, A: 2, C: 1, G: 1}
//这是统计数组中相同元素的个数

数组去重

let arr=[1,1,2,2,22,4,4,6,6,8]
let res=arr.reduce((a,b)=>{
    return a.includes(b)?a:a.concat(b)
},[])
console.log(res)//[1, 2, 22, 4, 6, 8]
//这是对数组去重
//连续可以去重，但是跳号的真的能去重？？

飞金币-Tween动画

//调用cc.tween使其飞行到目标节点的位置
//！！！！好像也不少人用 laya.tween
cc.tween(缓动系统)	:
cc.tween(this.node)
.to(time,{position:cc.v2(100,100),rotation:90})
.to(time,{scale:2})
.start()
//cc.tween在调用start时会将之前生成的action队列重新组合生成一个cc.sequence队列
//所以cc.tween的链式结构是依次执行每一个API的，也就是会执行完一个API再执行下一个API
cc.tween(this.node)
    // 0s 时，node 的 scale 还是 1
    .to(1, { scale: 2 })
    // 1s 时，执行完第一个 action，scale 为 2
    .to(1, { scale: 3 })
    // 2s 时，执行完第二个 action，scale 为 3
    .start()
    // 调用 start 开始执行 cc.tween
//cc.tween提供了两个设置属性的API:
//to:对属性进行绝对值计算，最终的运行结果即是设置的属性值
//by:对属性进行相对值计算，最终的运行结果是设置的属性值加上开始运行时节点的属性值
cc.tween(node)
  .to(1, {scale: 2})      // node.scale === 2
  .by(1, {scale: 2})      // node.scale === 4 (2+2)
  .by(1, {scale: 1})      // node.scale === 5 (4+1)
  .to(1, {scale: 2})      // node.scale === 2
  .start()
//repeat/repeatForever 函数会将前一个 action 作为作用对象。但是如果有参数提供了
//其他的 action 或者 tween，则 repeat/repeatForever 函数会将传入的 action 或者 tween 
//作为作用对象。
cc.tween(this.node)
    .by(1, { scale: 1 })
    // 对前一个 by 重复执行 10次
    .repeat(10)
    // 最后 node.scale === 11
    .start()
 
// 也可以这样用
cc.tween(this.node)
    .repeat(10,
        cc.tween().by(1, { scale: 1 })
    )
    .start()
 
// 一直重复执行下去
cc.tween(this.node)
    .by(1, { scale: 1 })
    .repeatForever()
    .start()
/**延迟执行：*/
cc.tween(this.node)
    // 延迟 1s
    .delay(1)
    .to(1, { scale: 2 })
    // 再延迟 1s
    .delay(1)
    .to(1, { scale: 3 })
    .start()

定时器

 
setInterval(()=>{},time)
//与setTimeout相似，setTimeout只回调一次，
//但是这个是每个time时间就回调，会一直回调

参考 reduce() 方法实战

JS数组reduce()方法详解及高级技巧 - 简书 (jianshu.com)

TypeScript语法参考文章

TypeScript Map 对象 | 菜鸟教程 (runoob.com)