-
Reflect是JavaScript中唯一专为元编程设计的内置对象，所有方法必须配合Proxy或显式调用才能生效；它不替代点号或方括号语法，而是将隐式操作显式化、可拦截化，核心价值在于可组合、可拦截、可预测的元操作控制。
-
HTML<template>元素是浏览器原生支持的惰性模板机制，不渲染、不执行脚本、不加载资源，仅通过JavaScript克隆插入DOM，具备防XSS、语义清晰、支持ShadowDOM等优势。
-
前端路由异步拦截核心是利用路由守卫配合Promise控制导航，确保权限校验、表单提示、数据预加载等关键操作完成后再跳转，并需超时控制与错误处理。
-
clamp()在margin/padding中按最小值、首选值（需用vmin等可伸缩单位）、最大值线性插值，非自动响应；需设合理上下限、避免单位混用、提供fallback、统一基准并抽离为CSS变量以保维护性。
-
本文详解如何在Formspree仅支持基础字段（如email、message）的限制下，使用前端JavaScript将用户填写的多个表单字段（姓名、邮箱、电话、消息）自动聚合并提交至Formspree后端。
-
要设置input输入框的默认值，最直接的方式是使用value属性，但需注意file类型无法预设文件路径，checkbox和radio需用checked属性设置默认选中状态，其他类型如text、number、email、date等均可通过value属性直接设定初始值，同时结合placeholder、required、min、max、pattern等属性可提升表单的可用性、校验能力和用户体验，而实际开发中还需应对客户端与服务器端校验不一致、跨浏览器兼容性差异、数据类型转换复杂、文件上传处理繁琐以及安全性风险等
-
最直接的方案是使用<stylescoped>，Vue会自动为组件元素添加唯一属性并为样式追加对应选择器实现局部化；还可启用CSSModules、手动命名空间（如BEM）、内联style动态绑定等方案。
-
JavaScript中this指向取决于调用方式而非定义方式：谁调用函数，this就指向谁（箭头函数除外，它继承外层this）。
-
使用视口单位、Flexbox和Grid布局实现高度自适应：1.设置vh或dvh单位确保全屏占位；2.Flex容器中主内容区设flex:1占据剩余空间；3.Grid通过grid-template-rows定义auto与fr组合分配行高；4.媒体容器用aspect-ratio或padding-top百分比保持宽高比，根据场景选择合适方案。
-
正确选择timing-function可提升透明度过渡的流畅性。通过opacity与transition配合，结合ease-out、ease-in或自定义cubic-bezier曲线，实现自然的淡入淡出效果，同时利用硬件加速优化性能。
-
现代浏览器推荐用navigator.clipboard.writeText()复制文本，但需HTTPS/localhost安全上下文且由用户交互触发；不支持富文本，移动端Safari13.4+才可用；降级可用document.execCommand('copy')，需动态创建聚焦textarea；readText()兼容性更差，Safari完全不支持。
-
CSS多属性动画的核心在于@keyframes定义各时间点的样式状态，通过animation属性应用，实现transform、opacity等属性的同步变化，并利用百分比节点和缓动函数精确控制动画阶段；为避免性能问题，应优先使用GPU加速属性如transform和opacity，避免频繁触发布局重排，合理使用will-change，减少复杂动画叠加；除@keyframes外，transition适用于简单状态过渡，WebAnimationsAPI提供更强大的JavaScript控制能力，三者各有适用场景。
-
空值合并运算符（??）仅在左侧为null或undefined时返回右侧值，否则返回左侧值；而逻辑或（||）对所有假值（如0、''、false、NaN）均触发替换。
-
!default仅在变量首次声明前生效，非后备值；一旦变量被声明（含空声明），后续!default均失效，且不支持表达式、递归引用或Mixin内稳定使用。
-
HTML5本身不提供投票组件或统计功能，纯前端仅能实现表单呈现，必须依赖后端处理提交、防重、存储与统计；localStorage等客户端存储无法实现真实多人投票。
