Senior programmer - 5 years of experience in large manufacturers, how to write code - one of the code notes of H5-WEBgl-typeScript

Table of contents

This article has been delayed for 2 months, right?

Approximate Features

array.reduce()

array.concat()

Array element statistics

Array deduplication

Refer to the reduce() method in practice


This article has been delayed for 2 months, right?

Most of them are handover documents from a senior colleague who doesn’t like to write notes .

So I can’t think of a good way to complain about him. The complaints may be in the next article 2. Supplementary

1. My former colleague’s logical ability is definitely very good, he has a good personality, and he is also very suitable to be a programmer.

Commonly known as " being able to make a living ", it's just that the output has really increased, and the wages have also increased, and the company "can't afford it"

2. He himself is not good at writing typeScript ; he is also very capable of re- learning a language and has problem-solving skills .

3. Can be used as someone else’s study notes for observation

Approximate Features

  • cocoscreator removes loading default logo
  • Welcome to nginx appears on the web page
  • cocoscreator fixedly rotates a node in a circular rotation in the area
  • cocoscreator canvas change size
  • Remove a component's prefab
  • Load and delete prefabs with cc.loader
  • cocos gets network phone status
  • Familiar with cocos animation editor (actually, the 5 or 6 animations I completed in the end are not official animation editors, they are the basic skills of the actual program )
  • cocos keyframe transition
  • Script control playback
  • LayaAir LayaBox
  • Cocos quickly locates lost resources
  • Installing Google Service Framework on Huawei Hongmeng System
  • Clean cache CCTextureCache and SpriteFrame when switching scenes
  • Resource loading resource subcontracting-animation clip

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

array.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
//这是对数组求和,如果数组中出现了字符串,那么字符串前的数字还是会求和,
//字符串之后的数字都会以字符串的形式相加起来

array.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]
//这是合并二维数组

Array element statistics

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}
//这是统计数组中相同元素的个数

Array deduplication

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]
//这是对数组去重
//连续可以去重,但是跳号的真的能去重??

Flying gold coins-Tween animation

//调用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()

timer


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

Refer to the reduce() method in practice

Detailed explanation and advanced techniques of JS array reduce() method - Jianshu (jianshu.com)

Guess you like

Origin blog.csdn.net/avi9111/article/details/133951893