JS/TS笔记学习1-编程知识

JS/TS笔记学习1

周末总得学点什么吧~
奥利给!

跑火车递归减速

let currentIndex = 0;  
let speed = 500; // 初始速度，单位是毫秒  
let decrement = 20; // 每次迭代速度减少的量  const cells = document.querySelectorAll('.cell');  function highlightCell() {  cells.forEach((cell, index) => {  cell.classList.remove('highlight');  if (index === currentIndex) {  cell.classList.add('highlight');  }  });  if (speed > 50) { // 当速度降低到一定程度时停止  speed -= decrement;  setTimeout(highlightCell, speed);  currentIndex = (currentIndex + 1) % cells.length; // 移动到下一个格子  }  
}  highlightCell(); // 开始跑火车

队列

/*** 将弹窗加入弹出窗队列* @param {string} panelPath * @param {string} scriptName * @param {*} param */public pushToPopupSeq(panelPath: string, scriptName: string, param: any) {let popupDialog = {panelPath: panelPath,scriptName: scriptName,param: param,isShow: false};this._arrPopupDialog.push(popupDialog);this._checkPopupSeq();}/*** 检查当前是否需要弹窗*/private _checkPopupSeq() {if (this._arrPopupDialog.length > 0) {let first = this._arrPopupDialog[0];if (!first.isShow) {this.showDialog(first.panelPath, first.param);this._arrPopupDialog[0].isShow = true;}}}/*** 将弹窗从弹出窗队列中移除* @param {string} panelPath */public shiftFromPopupSeq(panelPath: string) {this.hideDialog(panelPath, () => {if (this._arrPopupDialog[0] && this._arrPopupDialog[0].panelPath === panelPath) {this._arrPopupDialog.shift();this._checkPopupSeq();}})}

ts给readonly属性赋值
除了在声明它的类或构造函数内部被赋值，有些情况下(静态只读)可能需要赋值

class TweenSystem {  static readonly instance; // 声明静态只读属性  如何赋值呢？？？ 请看下面  // ... 其他代码保持不变 ...  public getNum(){console.log(123);}
}
//这种情况如何赋值只读属性呢，看下面

// 在类外部初始化 instance  
(TweenSystem.instance as any) = new TweenSystem();  
// 现在可以正确访问了  
const actionMgr = TweenSystem.instance;
actionMgr.getNum();   //123

那么为什么as any后就可以赋值(TweenSystem.instance as any)；
在 TweenSystem.instance as any 的情况下，通过类型断言将 TweenSystem.instance 的类型临时转换为 any，从而能够给它赋值。尽管这样做在技术上是可行的，但它破坏了 TypeScript 的类型安全原则，并可能导致运行时错误或难以追踪的 bug。
通常，不建议使用类型断言来修改 readonly 属性，除非有非常明确的原因，并且完全理解可能带来的后果。如果需要在类的外部初始化 readonly 属性，更好的做法是在类的内部进行初始化

单例模式

class Singleton {  // 使用一个私有的静态实例变量来存储类的唯一实例  private static instance: Singleton | null = null;  // 构造函数是私有的，这样外部就无法使用 new Singleton() 来创建新的实例  private constructor() {  // 初始化代码（如果有的话）  }  // 提供一个静态方法来获取类的唯一实例  // 如果实例不存在，则创建它  public static get getInstance(): Singleton {  if (Singleton.instance === null) {  Singleton.instance = new Singleton();  }  return Singleton.instance;  }  // 类的其他方法或属性  public someMethod() {  console.log("这是 Singleton 类的一个方法");  }  
}  
// 使用示例  
const singletonInstance = Singleton.getInstance;  
singletonInstance.someMethod(); // 调用 Singleton 类的方法   //out: 这是 Singleton 类的一个方法

而有些情况下也可以直接这样

class Singleton1 {  static readonly instance = new Singleton1();  // 构造函数是私有的，这样外部就无法使用 new Singleton1() 来创建新的实例  private constructor() {  // 初始化代码（如果有的话）  console.log("在编译完就直接创建了，不管你有没有调用")}// 类的其他方法或属性  someMethod() {  console.log("这是 Singleton1 类的一个方法");  }  
}  // 使用示例  
const Singleton1Instance = Singleton1.instance;  
Singleton1Instance.someMethod(); // 调用 Singleton1 类的方法