-
JavaScript是单线程语言，通过事件循环和任务队列实现异步并发。主线程执行同步代码时，异步任务由WebAPI处理完成后将回调加入队列。事件循环先执行宏任务，再清空微任务队列，确保Promise等微任务优先于下一轮宏任务执行。实际开发中可通过Promise、async/await、WebWorkers等手段避免阻塞，提升性能。
-
调试事件循环问题的核心是理解JavaScript单线程与任务队列机制，明确宏任务（如setTimeout）先执行、微任务（如Promise）紧随其后清空的顺序；2.使用浏览器Performance面板录制并分析主线程火焰图，定位超过50毫秒的长任务，识别是脚本执行、频繁DOM操作还是渲染瓶颈；3.在Node.js中借助--inspect、perf_hooks或clinic.js工具监控事件循环阶段（如poll阻塞）和CPU/内存使用情况，排查同步I/O或CPU密集型操作导致的服务器响应延迟；4.优化方案包
-
必须使用相同函数引用才能成功移除事件监听器，否则removeEventListener无效；因此应避免使用匿名函数或bind创建新引用，推荐具名函数、保存引用或使用AbortController统一管理。
-
:root是CSS根元素选择器，用于定义全局变量，如--primary-color:#007bff；通过var(--变量名)引用，可统一管理颜色、字体等样式值，提升维护性与主题定制灵活性，支持响应式及JavaScript动态切换，实现全站样式一致性。
-
答案是：Mac上HTML5开发需配置编辑器、浏览器和可选本地服务器。首先安装VSCode等编辑器编写代码，再用Chrome或Safari测试页面，创建index.html文件并写入HTML5基础结构后可直接双击预览；若需HTTP服务支持，则通过Node.js安装http-server启动本地服务器，在localhost:8080查看效果。
-
使用float和overflow可实现商品轮播基础布局：1.父容器设固定宽度并隐藏溢出；2.商品项左浮动、定宽排列；3.通过margin位移模拟切换，结合类名控制显示画面，适用于无JS场景或兼容旧浏览器。
-
要固定表格列宽不被内容撑开，最直接有效的方法是使用table-layout:fixed；1.为table元素设置table-layout:fixed，使浏览器按预设宽度布局而不根据内容自动调整；2.确保表格本身设置明确的宽度，如width:100%；3.通过第一行th/td或colgroup>col元素为列定义宽度，优先采用col的宽度设置；4.处理内容溢出时，单行文本可使用white-space:nowrap、overflow:hidden和text-overflow:ellipsis显示省略号，
-
位图通过二进制位高效存储布尔状态，以极小内存开销实现海量数据的快速查询与集合运算。其核心原理是将整数映射到位数组的特定位，利用位运算进行状态设置与检测，空间效率远超传统结构。例如，1亿用户状态仅需约12.5MB，查询时间复杂度接近O(1)。它广泛应用于UV统计、用户标签筛选、数据库位图索引、布隆过滤器及文件系统空间管理等场景。然而，位图在数据范围过大或极度稀疏时内存占用高，动态扩容成本大，且仅支持布尔状态。为此可采用RoaringBitmap等优化方案，按数据密度分块存储，并结合并发控制保障线程安全，从而
-
是flex容器的子元素，其定位参考父容器的坐标系，且z-index、显示顺序仍受flex上下文影响，但不再响应flex的尺寸分配与对齐属性。
-
position:relative使元素保持文档流位置并支持偏移，结合z-index可控制层叠顺序，z-index数值越大越靠前，同级元素未设z-index时后渲染的覆盖前一个，且父元素的层叠上下文影响子元素层级。
-
通过rgba与渐变结合，提升按钮hover状态的视觉反馈：1.调整rgba透明度增强背景对比；2.使用linear-gradient增加层次感；3.同时改变文字颜色与添加文本阴影；4.配合box-shadow或边框强化交互提示，使hover效果更自然清晰。
-
flex-direction属性定义Flex容器主轴方向，可选值为row（默认，水平左到右）、column（垂直上到下）、row-reverse（水平右到左）和column-reverse（垂直下到上），用于控制子元素排列方向，配合justify-content和align-items实现灵活布局。
-
卡片翻转效果通过CSS3D变换实现，核心是perspective创建透视、transform-style保留3D空间、backface-visibility隐藏背面；结构上用.card包裹.card-inner及前后两面，.card-inner在:hover时rotateY(180deg)触发翻转，配合transition实现动画，可通过rotateX或transform-origin扩展上下翻转或调整轴心。
-
:first-of-type和:last-of-type用于选中父元素中某类型元素的第一个或最后一个实例；例如p:first-of-type设置首个段落样式，p:last-of-type为末尾段落添加间距，不受中间其他标签影响；相比:first-child要求严格首位，这两个选择器仅关注同类型元素的位置，适用于文章排版、列表样式控制等场景，提升CSS语义性与简洁度。
-
掌握CSS与JavaScript结合的关键在于根据场景选择合适的方法：内联样式通过element.style直接操作，适合临时修改；内部或外部样式表可通过document.styleSheets动态添加规则，适用于批量控制；推荐使用classList切换预定义类，实现高效、可维护的动态样式。
