随笔分类 - javascript
摘要：一、Set 是什么（一句话） Set 是一个只允许“唯一值”的集合，常用于去重和快速查找。 二、创建 Set 1️⃣ 空 Set const s = new Set(); 2️⃣ 由数组创建（最常见） const s = new Set([1, 2, 2, 3]); // Set { 1, 2, 3
阅读全文
摘要：一、structuredClone 是什么？ structuredClone 是 JavaScript 原生提供的深拷贝 API，用于将一个值 完整复制为一个全新的副本，并且 不会共享任何引用。 它实现的是浏览器规范中的👉 Structured Clone Algorithm（结构化克隆算法） 这
阅读全文
摘要：✅ 方法 1：使用 entries()（推荐） for (const [index, data] of iconModelData.children.entries()) { console.log(index, data); } entries() 会把数组元素转成 [index, value]
阅读全文
摘要：事件循环机制： 主线程中存在一个「调用栈」（Call Stack） function foo() { console.log('foo'); setTimeout(() => console.log('foo timeout')); Promise.resolve().then(() => cons
阅读全文
摘要：localeCompare() 是字符串的方法，用来比较两个字符串在特定语言环境下的排序顺序。 chars.sort((a, b) => a.name.localeCompare(b.name)); 是按对象的 name 属性 按语言规则（通常是字母或拼音顺序）从小到大排序。 相比直接用 >、< 比
阅读全文
摘要：“主线程阻塞型帧堆积（Frame Backlog）” 是前端性能调优中一个非常核心但常被忽视的现象，尤其在 WebGL / Three.js / 游戏循环 或 高频 UI 渲染 场景下。 🧠 一、定义：什么是“主线程阻塞型帧堆积” 帧堆积（Frame Backlog） 指的是： 渲染任务（fram
阅读全文
摘要：Map 的好处： 键可以是任意类型（包括对象） 保持插入顺序 查找性能优于普通对象（尤其是大量键时） // 创建缓存 const cache = new Map(); // 存入数据 cache.set('user_1', { name: 'Alice', age: 25 }); // 读取数据 i
阅读全文
摘要：主进程 import ClearTouchGroundCacheCode from '../utils/workers/clearTouchGroundCache.worker.js'; const blob = new Blob([ClearTouchGroundCacheCode], { typ
阅读全文
摘要：1. 使用 call 方法 call 方法可以显式地调用一个函数，并指定 this 的指向 function greet(greeting) { console.log(`${greeting}, my name is ${this.name}`); } const person = { name:
阅读全文
摘要：1. 使用 debugger 关键字 在代码中添加 debugger; 语句会强制浏览器在执行到该行时暂停，前提是开发者工具处于打开状态。 function test() { const x = 10; debugger; // 程序在这里暂停 const y = x * 2; console.lo
阅读全文
摘要：1. break break 会直接退出当前循环，跳过循环体中剩余的代码，并终止整个循环。 示例 for (let i = 0; i < 5; i++) { if (i 3) { break; // 当 i 为 3 时退出循环 } console.log(i); // 输出: 0, 1, 2 } c
阅读全文
摘要：// 点击空白处日历切换 useEffect( function () { document.addEventListener('click', clickBody); return function () { document.removeEventListener('click', clickB
阅读全文
摘要：相关库： comlink worker-loader 主线程： import Worker from 'worker-loader!./worker.js'; import { Loader } from '@/utils/CWThree/Loader/Loader'; // 子线程加载模型 exp
阅读全文
摘要：用法：包裹请求方法即可控制调取缓存还是请求接口，并且判断缓存时间是否超时来进行数据更新 import { fetchWithCache } from '@/utils/indexedDb'; export const getThreeModel = (ciId) => fetchWithCache(
阅读全文
摘要：应用场景：需同步获取值的时候，回调方式使用起来比较难受，并且库里内并未提供同步api，此时可使用promise+await将回调方式改为同步执行， 核心：promise+await将回调改为同步调用 const result = await new Promise((resolve, reject)
阅读全文
摘要：事件分析 事件区分核心：使用onMouseDown、onMouseUp和定时器来区分单击事件与长按事件 按下时设置长按事件定时器（并加入长按回调），并记录当前时间戳， 松开事件中如果当前时间戳差值小于定时器则执行单击回调，并清除定时器，如果大于定时器事件，则按下事件中定时器的长按回调已经执行，事件末
阅读全文
摘要：关键点： 获取antd组件包裹的原生textArea实例：const textarea = expressInputRef.current.resizableTextArea.textArea; 获取光标位置：const { selectionStart, selectionEnd } =texta
阅读全文
摘要：需求：先打印下方123 a.forEach(()=>{ await funcA() }) console.log("1231231231") 思路： 你应该使用 map() 来创建一个包含异步操作的 Promise 数组，并使用 Promise.all() 来等待所有的异步操作完成。 实现： con
阅读全文
摘要：const params = new URLSearchParams({ param1: 'value1', param2: 'value2' }).toString(); 该方法可将param1和param2拼接为 param1=value1¶m2=value2 实例 const url
阅读全文
摘要：直接下载：适用于简单场景，不发送请求直接使用浏览器获取文件 /** * @description: 下载图片/文件 * @return {*} */ export const download = (url = '', newUrl) => { const iframe = document.cre
阅读全文
浙公网安备 33010602011771号