通义灵码可快速生成带cancel的防抖函数和两种节流函数；防抖需保持timer变量名不变，节流须明确时间戳版或定时器版；接入时应先实例化再绑定事件，避免内存泄漏。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
通义灵码中快速生成防抖函数
在通义灵码里输入自然语言指令“写一个带取消功能的防抖函数，延迟500毫秒，支持this绑定和参数透传”，它会直接输出可运行的 JavaScript 代码。
按下 Tab 键或点击「插入」，代码自动粘贴到编辑器光标处；此时不要手动修改闭包变量名 timer 或 lastTime，【改了会导致多次调用时定时器无法清除】。
若生成结果没带 cancel 方法，就追加一句提示：“请给这个防抖函数加上 cancel 钩子，能手动清空未执行的定时器”——通义灵码通常一次补全成功。
通义灵码中生成节流函数的两种可靠写法
节流比防抖更容易因实现方式不同导致行为偏差，所以必须明确告诉通义灵码你想要哪一种：
方法一：时间戳版（推荐用于 scroll/resize）
输入：“用时间戳实现节流函数，保证每800毫秒最多执行一次，首次触发立即执行”。
方法二：定时器版（适合 mousemove 拖拽场景）
输入：“用 setTimeout 实现节流，第一次触发立刻执行，之后800毫秒内重复触发不响应，800毫秒后恢复”。
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
两种版本底层逻辑不同：时间戳版依赖 Date.now() 对比，无定时器残留；定时器版需维护 timer 引用，【若忘记置 null，连续触发会堆积多个 setTimeout】。
把通义灵码生成的代码接入真实事件
第一步：复制生成的 debounce 或 throttle 函数，粘贴到项目 utils 目录下的 tools.js 中。
第二步：在业务文件顶部 import { debounce } from '@/utils/tools.js'。
第三步：绑定 input 事件时，不要写成 input.addEventListener('input', () => debounce(fn, 300)(e))——这会每次触发都新建防抖函数实例，【timer 无法跨次共享，防抖失效】。
正确写法是先创建防抖实例再绑定：
const handleInput = debounce((e) => { console.log(e.target.value) }, 300);
input.addEventListener('input', handleInput);
第四步：滚动加载场景下，节流函数必须在页面卸载前移除监听器，否则 timer 会持续持有 DOM 引用，造成内存泄漏。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
